Kotlin笔记(32) — 代码设置LinearLayout布

2020-10-12  本文已影响0人  奔跑的佩恩

前言

在上篇文章,我们讲过了RadioButton的基本使用,这节让我们来学习下线性布局LinearLayout的相关知识。

今天涉及知识点:

  1. kotlin设置布局属性的一些变化
  2. anko库像素相关方法表
  3. Activity中设置布局的代码
  4. 效果图和项目结构图
  5. LayoutHelper类源码

先来波效果图:


效果图.gif

更多精彩内容,请关注微信公众号 "Android进击",大家一起来学习进步吧


一. kotlin设置布局属性的一些变化

kotlin中已经很少有set/get方法了。例如设置LinearLayout的方向可以直接这样:

        //设置线性布局的方向(注:ll_inner为布局中LinearLayout的id)
       ll_inner.orientation= LinearLayout.HORIZONTAL

然后设置LinearLayout中子控件内部居中的话,可以这样:

        //设置布局内部控件居中(注:ll_inner为布局中LinearLayout的id)
       ll_inner.gravity= Gravity.CENTER

kotlin 使用关键字 as 来表示类型强转,然后用this@MainActivity来表示MainActivity.this

二.anko库像素相关方法表

由于anko库的加持(当然,你需要在你项目中引入anko库),在kotlindpsppx间的相互转换也变得简单起来,例如dip(50)表示将50dp转为50px.具体对照表如下:

Anko库单位转换方法 说明
dip dp转成以px为单位的数值
sp sp转成以px为单位的数值
px2dip px转成以dip为单位的数值
px2sp px转成以sp为单位的数值
dimen dip转成以sp为单位的数值

三. Activity中设置布局的代码

下面让我们来看看LinearLayout动态布局在Activity中使用的示例。
MainActivity代码如下,其中LayoutHelper类封装了对于布局控件的设置:

open class MainActivity : AppCompatActivity(),View.OnClickListener{

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_test)

        init()
        initData()
        setListener()
    }

    private fun init(){
        //开启调试
        LogUtil.setDebug(true)
    }

    private fun initData(){
        //初始化设置布局方向和子空间居中
        LayoutHelper.initLayout(ll_inner)
    }

    private fun setListener(){
        btn_1.setOnClickListener(this)
        btn_2.setOnClickListener(this)
        btn_3.setOnClickListener(this)
        btn_4.setOnClickListener(this)
    }

    override fun onClick(v: View) {
        when (v.id) {
            R.id.btn_1 -> LayoutHelper.setBtn1Layout(ll_inner,this@MainActivity)
            R.id.btn_2 -> LayoutHelper.setBtn2Layout(ll_inner,this@MainActivity)
            R.id.btn_3 -> LayoutHelper.setBtn3Layout(ll_inner,this@MainActivity)
            R.id.btn_4 -> LayoutHelper.setBtn4Layout(ll_inner,this@MainActivity)
        }
    }

}

对应的布局文件activity_test.xml代码如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:background="@color/white">

        <LinearLayout
            android:id="@+id/ll_inner"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@color/green">

            <View
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@color/red"/>
        </LinearLayout>

    </LinearLayout>

    <Button
        android:id="@+id/btn_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="14sp"
        android:textColor="@color/black"
        android:text="1" />

    <Button
        android:id="@+id/btn_2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="14sp"
        android:textColor="@color/black"
        android:text="2" />

    <Button
        android:id="@+id/btn_3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="14sp"
        android:textColor="@color/black"
        android:text="3" />

    <Button
        android:id="@+id/btn_4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="14sp"
        android:textColor="@color/black"
        android:text="4" />

</LinearLayout>

四. 效果图和项目结构图

效果图.gif
项目结构图.png

五. LayoutHelper类源码

LayoutHelper源码如下:

上一篇 下一篇

猜你喜欢

热点阅读