美文网首页安卓开发
安卓自定义view实现标签栏(只支持固定两个标签)

安卓自定义view实现标签栏(只支持固定两个标签)

作者: 蓝不蓝编程 | 来源:发表于2020-06-06 14:32 被阅读0次

实现效果图

主要代码

class TabView(context: Context, attributeSet: AttributeSet?) : LinearLayout(context, attributeSet) {
    private lateinit var firstTab: View
    private lateinit var secondTab: View
    private val firstTabIndex = 0
    private val secondTabIndex = 1
    private var selectedTab = firstTabIndex
    private val textSize = 20f
    private val bottomSplitColor = "#FA871E"
    private val centerSplitColor = "#666666"
    private val bottomSplitWidth = 50
    private val bottomSplitHeight = 4
    private val centerSplitWidth = 1
    private val centerSplitHeight = 40
    private lateinit var mOnSwitchListener: OnSwitchListener

    fun initTabs(
        firstTabText: String,
        secondTabText: String,
        selectedIndex: Int,
        onSwitchListener: OnSwitchListener
    ) {
        mOnSwitchListener = onSwitchListener
        setOrientation()

        firstTab = addTab(firstTabText)
        addCenterSplit()
        secondTab = addTab(secondTabText)
        selectTab(selectedIndex)
        setOnClickListener { switchTab() }
    }

    interface OnSwitchListener {
        fun onSwitched(selectedIndex: Int)
    }

    private fun selectTab(tabIndex: Int) {
        if (tabIndex == firstTabIndex) {
            firstTab.visibility = View.VISIBLE
            secondTab.visibility = View.INVISIBLE
        } else {
            firstTab.visibility = View.INVISIBLE
            secondTab.visibility = View.VISIBLE
        }
        selectedTab = tabIndex
    }

    private fun switchTab() {
        if (selectedTab == firstTabIndex) {
            selectTab(secondTabIndex)
        } else {
            selectTab(firstTabIndex)
        }
        mOnSwitchListener.onSwitched(selectedTab)
    }

    private fun setOrientation() {
        orientation = HORIZONTAL
    }

    private fun getBottomSplitView(): View {
        val view = View(context)
        view.setBackgroundColor(Color.parseColor(bottomSplitColor))
        return view
    }

    private fun getBottomSplitLayoutParams(): LayoutParams {
        val layoutParams = LayoutParams(bottomSplitWidth, bottomSplitHeight)
        layoutParams.setMargins(3, 3, 3, 3)
        layoutParams.gravity = Gravity.CENTER_HORIZONTAL
        return layoutParams
    }

    private fun addCenterSplit() {
        val view = View(context)
        view.setBackgroundColor(Color.parseColor(centerSplitColor))
        addView(view, getCenterSplitLayoutParams())
    }

    private fun getCenterSplitLayoutParams(): LayoutParams {
        val layoutParams = LayoutParams(centerSplitWidth, centerSplitHeight)
        layoutParams.setMargins(3, 0, 3, 0)
        layoutParams.gravity = Gravity.CENTER_VERTICAL
        return layoutParams
    }

    private fun addTab(text: String): View {
        var linearLayout = LinearLayout(context)
        linearLayout.orientation = VERTICAL
        val textView = getTextView(text)
        linearLayout.addView(
            textView,
            LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT)
        )
        val splitView = getBottomSplitView()
        linearLayout.addView(splitView, getBottomSplitLayoutParams())
        addView(linearLayout, LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT))
        return splitView
    }

    private fun getTextView(text: String): TextView {
        val textView = TextView(context)
        textView.text = text
        textView.setPadding(10, 10, 10, 10)
        textView.textSize = textSize
        return textView
    }
}

完整源代码

https://gitee.com/cxyzy1/custTabView

相关文章

网友评论

    本文标题:安卓自定义view实现标签栏(只支持固定两个标签)

    本文链接:https://www.haomeiwen.com/subject/syvazhtx.html