用Kotlin实现简单的自定义ActionSheetView

Kotlin 引言

Google IO 2017 宣布了 Kotlin 会成为 Android 官方开发语言。

Kotlin 是一个基于 JVM 的新的编程语言,由 JetBrains 开发。
Kotlin可以编译成Java字节码,也可以编译成JavaScript,方便在没有JVM的设备上运行。
JetBrains,作为目前广受欢迎的Java IDE IntelliJ 的提供商,在 Apache 许可下已经开源其Kotlin 编程语言。
Kotlin已正式成为Android官方开发语言。

正文

今天我主要介绍的是使用Kotlin去写一个简单的自定义View,从而学习Kotlin语言的各种魅力。

Gradle引入

model中

apply plugin: 'kotlin-android'

android {
    sourceSets {
        main.java.srcDirs += 'src/main/kotlin'
    }
}

compile 'org.jetbrains.kotlin:kotlin-stdlib:1.1.2-4'

工程中引入

buildscript {
    ext.kotlin_version = '1.1.2-4'
    repositories {
        jcenter()
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:2.3.2'
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"

        // NOTE: Do not place your application dependencies here; they belong
        // in the individual module build.gradle files
    }
}

Kotlin代码

常量:ActionSheetConstants.kt

/**
 * Created by zyao89 on 2017/5/24.
 * Contact me at 305161066@qq.com or zyao89@gmail.com
 * For more projects: https://github.com/zyao89
 * My Blog: http://zyao89.me
 */
const val DEFAULT_COLOR: Int = 0xFF_02_7B_FF.toInt()
const val DEFAULT_SHADE_COLOR: Int = 0x88_00_00_00.toInt()
const val DEFAULT_BTN_CANCEL_COLOR: Int = 0xFF_87_87_87.toInt()
const val DEFAULT_BTN_SELECT_COLOR: Int = 0xFF_3D_DD_B0.toInt()

代码块一: BaseActionSheetView.kt

/**
 * Created by zyao89 on 2017/5/24.
 * Contact me at 305161066@qq.com or zyao89@gmail.com
 * For more projects: https://github.com/zyao89
 * My Blog: http://zyao89.me
 */
abstract class BaseActionSheetView(val context: Context, val list: List<ActionSheetBtnInfo>, val rootView: ViewGroup = ((context as Activity).window.decorView as ViewGroup)) : View.OnClickListener, View.OnTouchListener {
    protected val mBtnViewList: LinkedList<TextView> = LinkedList()
    protected var mCustomContent: LinearLayout? = null
    protected var mBtnCancel: TextView? = null
    //POP总容器
    private var mFrameLayout: FrameLayout = FrameLayout(context)
            .apply {
                setBackgroundColor(DEFAULT_SHADE_COLOR)
            }
    private var mPopupWindow: PopupWindow = PopupWindow(this.initView()
            .apply {
                mCustomContent = findViewById(R.id.pop_layout) as LinearLayout
                setOnTouchListener(this@BaseActionSheetView)
            }, MATCH_PARENT, MATCH_PARENT, true)
            .apply {
                animationStyle = R.style.popwin_anim_style
                setOnDismissListener { this@BaseActionSheetView.dismiss() }
                inputMethodMode = PopupWindow.INPUT_METHOD_NEEDED
                softInputMode = WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE
            }

    init {
        this.initBtn()
        this.initCancel()
    }

    protected abstract fun initView(): View
    protected abstract fun initBtn()
    protected abstract fun initCancel()

    override fun onClick(v: View?) {
        when (v) {
            mBtnCancel -> {

            }
            is TextView, is Button -> v.tag.takeIf { it is Int }?.let {
                val onClickListener = list[v.tag as Int].onClickListener
                onClickListener?.onClick(v)
            }
            else -> {

            }
        }
        mPopupWindow.dismiss()
    }

    override fun onTouch(v: View?, event: MotionEvent?): Boolean {
        val height: Int = mCustomContent?.top!!.toInt()
        val y: Int = event?.y!!.toInt()
        when (event.action) {
            MotionEvent.ACTION_UP -> {
                y.takeIf { it < height }.let {
                    println("y: $y")
                    println("height: $height")
                    mPopupWindow.dismiss()
                }
            }
        }
        return true
    }

    private fun dismiss() {
        rootView.removeView(mFrameLayout)
    }

    fun setCancelText(text: String) {
        this.mBtnCancel?.text = text
    }

    fun setCancelTextColor(color: Int) {
        this.mBtnCancel?.setTextColor(color)
    }

    fun setCancelTextSize(size: Float) {
        this.mBtnCancel?.setTextSize(TypedValue.COMPLEX_UNIT_SP, size)
    }

    fun hideCancel() {
        this.mBtnCancel?.visibility = View.GONE
    }

    fun show() {
        rootView.addView(mFrameLayout, MATCH_PARENT, MATCH_PARENT)
        mPopupWindow.showAtLocation(mFrameLayout, Gravity.BOTTOM or Gravity.CENTER_HORIZONTAL, 0, 0)
    }

    /**
     * 根据手机的分辨率从 dp 的单位 转成为 px(像素)
     */
    protected fun dip2px(context: Context, dpValue: Float): Int {
        return TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dpValue, context.resources.displayMetrics).toInt()
    }
}

代码块二:ActionSheetBtnInfo.kt

/**
 * Created by zyao89 on 2017/5/24.
 * Contact me at 305161066@qq.com or zyao89@gmail.com
 * For more projects: https://github.com/zyao89
 * My Blog: http://zyao89.me
 */
data class ActionSheetBtnInfo(var text: String, var textColor: Int = DEFAULT_COLOR, var backgroundResource: Int = R.drawable.custom_view_select_pop_selector_btn) : Serializable {
    companion object {
        //这里可以填写单例
    }

    var onClickListener: View.OnClickListener? = null

    /**
     * 自定义get和set方法
     */
    var textSize: Float? = null
        get() = field
        set(value) {
            field = value
        }
}

代码块三:ActionSheetView.kt

/**
 * Created by zyao89 on 2017/5/24.
 * Contact me at 305161066@qq.com or zyao89@gmail.com
 * For more projects: https://github.com/zyao89
 * My Blog: http://zyao89.me
 */
class ActionSheetView(context: Context, list: List<ActionSheetBtnInfo>) : BaseActionSheetView(context, list) {

    override fun initView(): View {
        return View.inflate(context, R.layout.custom_view_select_pop, null)
    }

    override fun initBtn() {
        for ((index, btnInfo) in list.withIndex()) {
            TextView(context)
                    .apply {
                        tag = index
                        text = btnInfo.text
                        btnInfo.textSize?.let {
                            setTextSize(TypedValue.COMPLEX_UNIT_SP, it)
                        }
                        height = dip2px(context, 44.0f)
                        gravity = Gravity.CENTER
                        layoutParams = ViewGroup.LayoutParams(MATCH_PARENT, dip2px(context, 44.0f))
                        setTextColor(btnInfo.textColor)
                        setBackgroundResource(btnInfo.backgroundResource)
                        setOnClickListener(this@ActionSheetView)
                    }
                    .also {
                        val layoutParams = LinearLayout.LayoutParams(MATCH_PARENT, MATCH_PARENT)
                        layoutParams.topMargin = dip2px(context, 5.0f)
                        mCustomContent?.addView(it, index, layoutParams)
                    }
                    .let {
                        mBtnViewList.add(it)
                    }
        }
    }

    override fun initCancel() {
        mBtnCancel = TextView(context)
                .apply {
                    text = "Cancel"
                    height = dip2px(context, 44.0f)
                    gravity = Gravity.CENTER
                    layoutParams = ViewGroup.LayoutParams(MATCH_PARENT, dip2px(context, 44.0f))
                    setTextColor(if (list.isEmpty()) DEFAULT_BTN_SELECT_COLOR else list[0].textColor)
                    setBackgroundResource(if (list.isEmpty()) R.drawable.custom_view_select_pop_selector_btn else list[0].backgroundResource)
                    setOnClickListener(this@ActionSheetView)
                }
                .apply {
                    val layoutParams = LinearLayout.LayoutParams(MATCH_PARENT, MATCH_PARENT)
                    layoutParams.topMargin = dip2px(context, 15.0f)
                    layoutParams.bottomMargin = dip2px(context, 20.0f)
                    mCustomContent?.let {
                        mCustomContent?.addView(this@apply, it.childCount, layoutParams)
                    }
                }
    }
}

代码块四:ActionSheetListView.kt

/**
 * Created by zyao89 on 2017/5/24.
 * Contact me at 305161066@qq.com or zyao89@gmail.com
 * For more projects: https://github.com/zyao89
 * My Blog: http://zyao89.me
 */
class ActionSheetListView(context: Context, list: List<ActionSheetBtnInfo>) : BaseActionSheetView(context, list) {

    override fun initView(): View {
        return View.inflate(context, R.layout.custom_view_select_list_pop, null)
    }

    override fun initBtn() {
        for ((index, btnInfo) in list.withIndex()) {
            TextView(context)
                    .apply {
                        tag = index
                        text = btnInfo.text
                        btnInfo.textSize?.let {
                            setTextSize(TypedValue.COMPLEX_UNIT_SP, it)
                        }
                        height = dip2px(context, 44.0f)
                        gravity = Gravity.CENTER
                        layoutParams = ViewGroup.LayoutParams(MATCH_PARENT, dip2px(context, 44.0f))
                        setTextColor(btnInfo.textColor)
                        setBackgroundResource(R.drawable.custom_view_select_list_pop_selector_btn)
                        setOnClickListener(this@ActionSheetListView)
                    }
                    .also {
                        val layoutParams = LinearLayout.LayoutParams(MATCH_PARENT, MATCH_PARENT)
                        layoutParams.topMargin = 1
                        mCustomContent?.addView(it, index, layoutParams)
                    }
                    .let {
                        mBtnViewList.add(it)
                    }
        }
    }

    override fun initCancel() {
        mBtnCancel = TextView(context)
                .apply {
                    text = "Cancel"
                    height = dip2px(context, 44.0f)
                    gravity = Gravity.CENTER
                    layoutParams = ViewGroup.LayoutParams(MATCH_PARENT, dip2px(context, 44.0f))
                    setTextColor(DEFAULT_BTN_CANCEL_COLOR)
                    setBackgroundResource(R.drawable.custom_view_select_list_pop_selector_btn)
                    setOnClickListener(this@ActionSheetListView)
                }
                .apply {
                    val layoutParams = LinearLayout.LayoutParams(MATCH_PARENT, MATCH_PARENT)
                    layoutParams.topMargin = 1
                    layoutParams.bottomMargin = dip2px(context, 1.0f)
                    mCustomContent?.let {
                        mCustomContent?.addView(this@apply, it.childCount, layoutParams)
                    }
                }
    }
}

布局文件Layout

layout布局一:custom_view_select_pop.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:gravity="center_horizontal"
                android:orientation="vertical" >

    <LinearLayout
        android:id="@+id/pop_layout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:gravity="center_horizontal"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:orientation="vertical" >
    </LinearLayout>

</RelativeLayout>

layout布局二:custom_view_select_list_pop.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:gravity="center_horizontal"
                android:orientation="vertical" >

    <LinearLayout
        android:id="@+id/pop_layout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:gravity="center_horizontal"
        android:orientation="vertical" >
    </LinearLayout>

</RelativeLayout>

anim文件
ppwindow_show_anim.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:duration="300"
        android:fromXDelta="0"
        android:toXDelta="0"
        android:fromYDelta="200"
        android:toYDelta="0"
        />
    <alpha
        android:duration="300"
        android:fromAlpha="0"
        android:toAlpha="1"
        />
</set>

ppwindow_hide_anim.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:duration="200"
        android:fromXDelta="0"
        android:toXDelta="0"
        android:fromYDelta="0"
        android:toYDelta="200"
        />
    <alpha
        android:duration="200"
        android:fromAlpha="1"
        android:toAlpha="0"
        />
</set>

drawable文件
custom_view_select_list_pop_selector_btn.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" >
        <shape>
            <solid android:color="#cccccccc"/>
        </shape>
    </item>
    <item>
        <shape>
            <solid android:color="@android:color/white"/>
        </shape>
    </item>
</selector>

custom_view_select_pop_selector_btn.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" >
        <shape>
            <solid android:color="#cccccccc"/>
            <corners android:radius="10dp" />
        </shape>
    </item>
    <item  >
        <shape>
            <solid android:color="@android:color/white"/>
            <corners android:radius="10dp"/>
        </shape>
    </item>
</selector>

styles.xml

<resources>
    <style name="popwin_anim_style">
        <item name="android:windowEnterAnimation">@anim/ppwindow_show_anim</item>
        <item name="android:windowExitAnimation">@anim/ppwindow_hide_anim</item>
    </style>
</resources>

演示

ActionSheetListView.png
ActionSheetView.png

GitHub源码:zyao89/ZActionSheetView


作者:Zyao89;转载请保留此行,谢谢;

个人博客:https://zyao89.cn

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,445评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,889评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,047评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,760评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,745评论 5 367
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,638评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,011评论 3 398
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,669评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,923评论 1 299
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,655评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,740评论 1 330
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,406评论 4 320
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,995评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,961评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,197评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,023评论 2 350
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,483评论 2 342

推荐阅读更多精彩内容