Explicação detalhada da versão kotlin da caixa de diálogo personalizada com cantos arredondados

Primeiro, dê uma olhada nas renderizações da seguinte maneira:

Insira a descrição da imagem aqui

Ponto

Insira a descrição da imagem aqui

1. Introdução ao histórico

Eu encontrei uma demanda por um pequeno pacote nas prateleiras do exterior, e o diagrama de efeitos foi fornecido acima. Na verdade, também é uma caixa de diálogo simples. É apenas um pequeno requisito:

1. Existem cantos arredondados
2. A imagem de fundo pode ser substituída dinamicamente
3. O texto pode ser substituído dinamicamente
4. Cantos arredondados de botão, substituição dinâmica de texto, substituição dinâmica de cor de fundo.

Pedi ao ladrão que fosse simples, pensando que todo pacote deveria usar essa caixa de diálogo, então surgiu a ideia: acabei de aprender kt e customizei a visualização quando remei sozinho há algum tempo. Também me perguntei se poderia fazer um aar sozinho, como usar uma biblioteca de terceiros. Não ficaria feliz em mover tijolos no futuro? Como calouro, você precisa fazer mais, pensar mais e fazer um bom trabalho! Aqui está um simples. O foco é resumir a colheita. . .

Em segundo lugar, as etapas detalhadas da caixa de diálogo personalizada

1. Idéias

Qualquer pessoa que conheça visualizações customizadas sabe que customizar visualizações totalmente novas às vezes é mais complicado, e muitas delas precisam ser processadas por nós, como processamento de wrap_content, adição de preenchimento à visualização e assim por diante. Felizmente, nosso diálogo personalizado é relativamente simples. Basta expandir a visualização original.

(1) Crie uma classe para herdar o diálogo

(2) Carregar o layout

(3) Adicionar estilo

(4) Expor a interface

2. Implementação simples

(1) Crie uma classe para herdar o diálogo

Não há muito a dizer sobre este, foi lançado três vezes. . .

/**
 * Created by sunnyDay on 2019/8/22 19:33
 */
class SubscriptionDialog : Dialog {
    
    
}

(2) Carregar o layout

Carregar o layout é, na verdade, converter o arquivo de layout xml em uma visualização e depois exibi-lo.
Existem dois métodos convencionais:
1. Método
inflate da visualização 2. Método inflate do LayoutInflater (há um buraco ao personalizar a caixa de diálogo)
Na verdade, o método setContentView fornecido na classe de diálogo também é o layout convertido para visualização (há um buraco ao personalizar a caixa de diálogo)

(3) Adicionar estilo

O estilo é semelhante ao tema da atividade. Embeleze o diálogo. . .


    <!--自定义对话框的样式-->
    <style name="SubscriptionDialog" parent="@style/AlertDialog.AppCompat">
        <!--边框-->
        <item name="android:windowFrame">@null</item>
        <!--是否浮现在activity之上-->
        <item name="android:windowIsFloating">true</item>
        <!--半透明-->
        <item name="android:windowIsTranslucent">false</item>
        <!--无标题-->
        <item name="android:windowNoTitle">true</item>
        <!--提示框背景-->
        <item name="android:windowBackground">@android:color/transparent</item>
    </style>

(4) Expor a interface

Basta fornecer alguns métodos, como evento de botão de diálogo, modificação do conteúdo do título. . .

(5) Código-fonte

/**
 * Created by sunnyDay on 2019/8/22 19:33
 */
class SubscriptionDialog : Dialog {
    
    

    private var mOnContinueClickListener: OnContinueClickListener? = null

    /**
     *  use default dialog style
     * */
    constructor(context: Context) : super(context, R.style.SubscriptionDialog) {
    
    
        setContentView(R.layout.dialog_simple)
    }

    /**
     *  user give a custom dialog style
     * */
    constructor(context: Context, dialogStyle: Int) : super(context, dialogStyle) {
    
    
        setContentView(R.layout.dialog_simple)
    }

    /**
     * set image of dialog
     * */
    fun setImage(img: Int): SubscriptionDialog {
    
    
//        when (img) {
    
    
//            img is Int -> iv_img.setImageResource(img as Int)
//            img is Drawable -> iv_img.setImageDrawable(img as Drawable)
//            img is Bitmap -> iv_img.setImageBitmap(img as Bitmap)
//        }
        iv_img.setImageResource(img)
        return this
    }

    /**
     * set the content of dialog
     * */
    fun setContentText(content: String): SubscriptionDialog {
    
    
        tv_content.text = content
        return this
    }

    /**
     * set the content of dialog
     * */
    fun setContentTextColor(contextTextColor: Int): SubscriptionDialog {
    
    
        tv_content.setTextColor(contextTextColor)
        return this
    }

    /**
     * set text of button
     * */
    fun setButtonText(btnText: CharSequence): SubscriptionDialog {
    
    
        bt_button.text = btnText
        return this
    }

    /**
     * set color of button text
     * */
    fun setButtonTextColor(textColor: Int): SubscriptionDialog {
    
    
        bt_button.setTextColor(textColor)
        return this
    }

    /**
     * set color of button bg
     * */
    fun setButtonBackgroundColor(btnBgColor: Int): SubscriptionDialog {
    
    
        bt_button.setBackgroundColor(btnBgColor)
        return this
    }

    /**
     * onClickListener of dialog
     * */
    fun setOnContinueClickListener(onContinueClickListener: OnContinueClickListener?): SubscriptionDialog {
    
    
        mOnContinueClickListener = onContinueClickListener
        onButtonClick()
        return this
    }

    /**
     * show dialog
     * */
    fun showDialog() {
    
    
        this.show()
    }

    /**
     * close dialog
     * */
    fun dismissDialog() {
    
    
        this.dismiss()
    }

    private fun onButtonClick() {
    
    
        bt_button.setOnClickListener {
    
    
            mOnContinueClickListener?.onClick()
                ?: throw Exception("onContinueClickListener is null,please give a non-value.")
        }
    }

    interface OnContinueClickListener {
    
    
        fun onClick()
    }
}

Três, pacote como aar

1. Entenda

1. Na verdade, nossos projetos são divididos em: projeto Android, biblioteca Android, biblioteca java.
2. Por que empacotar aar? Diferença da embalagem do frasco:

A etapa interna do pacote jar contém apenas o arquivo de classe e o arquivo de manifesto.O arquivo
aar contém todos os arquivos de recursos, incluindo arquivos de recursos de classe e res. Conveniente para usarmos
arquivos res

2. Embalagem

(1) A biblioteca Android opera diretamente da seguinte forma

Insira a descrição da imagem aqui

(2) Projeto Android

Precisa se tornar uma biblioteca e pacote Android como acima

Mudar etapas

Remova o código inútil:
1. O manifesto retém apenas o nó do aplicativo e seus atributos.
2. App.build é removido da seguinte forma:

Insira a descrição da imagem aqui

Então empacote

Insira a descrição da imagem aqui

3. Use

(1) Copie o pacote aar para a biblioteca de seu projeto

(2) Adicionar suporte a kotlin e introdução aar (nosso diálogo é empacotado em kotlin)

//1、工程的build.grdle添加:

buildscript {
    
    
    ext.kotlin_version = '1.3.21' // kt 版本
    repositories {
    
    
        google()
        jcenter()
        
    }
    dependencies {
    
    
        classpath 'com.android.tools.build:gradle:3.2.0'
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"//kt插件
       
    }
}

// 2、项目的build.gradle 添加:
apply plugin: 'kotlin-android'
apply plugin: 'kotlin-android-extensions'

// 3、引入aar:

 repositories {
    
    
   flatDir {
    
    
     dirs 'libs' 
   }

 }

 dependencies {
    
    

   implementation(name: 'SubscriptionDialog_1.0.1', ext: 'aar') //必须引入
   implementation 'com.android.support:design:28.0.0'//必须引入,自定义dialog有使用
 }

4. Simples de usar
  val dialog = SubscriptionDialog(this)
        dialog
            .setImage(R.drawable.peiqi)//背景图
            .setContentText("hello custom dialog 、hello custom dialog 、hello custom dialog ")//内容
            .setContentTextColor(Color.RED)//内容的字体颜色
            .setButtonText("sunny")//按钮字体
            .setButtonTextColor(Color.BLACK) // 按钮字体颜色
            .setButtonBackgroundColor(Color.parseColor("#FFD81B60"))
            .setOnContinueClickListener(object : SubscriptionDialog.OnContinueClickListener {
    
    
                override fun onClick() {
    
    
                    Toast.makeText(applicationContext, "simple dialog", Toast.LENGTH_LONG).show()
                    dialog.dismissDialog()
                }
            })
            .showDialog()

Resumo de pisar no fosso

1. Problema de falha no tamanho do diálogo

Quando LayoutInflate é usado, o tamanho da caixa de diálogo de configuração de inflar é inválido.

2. Definição de cantos arredondados

A escolha da forma e do cardview
Ao usar o formato, os cantos arredondados se tornam inválidos quando o plano de fundo da caixa de diálogo muda. Você pode considerar o uso do cardview como layout. Se o estilo do diálogo quase não precisa ser alterado, a forma pode ser usada.

3 、 NoClassDefFoundError

Ao encontrar seu projeto java neste artigo, você não pode apresentar o artigo de referência do ambiente kotlin

fim

download aar

Acho que você gosta

Origin blog.csdn.net/qq_38350635/article/details/100052362
Recomendado
Clasificación