美文网首页
Android 控件及布局

Android 控件及布局

作者: 风之化身呀 | 来源:发表于2019-07-03 22:51 被阅读0次

    1、常用控件

    所有 android 控件都有一个属性 visibility 控制显示与隐藏,View.VISIBLE:显示;View.INVISIBLE:不可见,但仍占据位置;View.GONE:不可见,也不占据位置。通过控件的 setVisibility 方法来设置

    • TextView
     <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center" // 设置对齐
            android:textSize="24sp"  // 字体以 sp 为单位
            android:textColor="@android:color/background_dark"
            android:text="TextView"/>
    
    • Button
     <Button
            android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" 
            android:text="text"
            android:textAllCaps="false"
            android:gravity="center"/>
    
    • EditText
        <EditText
            android:id="@+id/edit"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:maxLines="2" // 最大行数
            android:text="text" /> // 默认值
            android:hint="type something here"  // placeholder
            />
    

    可通过 EditText 的实例方法 getText 获取输入内容

    • ImageView
        <ImageView
            android:id="@+id/image"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_launcher_background"/>
    

    可通过 ImageView 的实例方法 setImageResource 改变 src

    • ProgressBar
        <ProgressBar
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            style="?android:attr/progressBarStyleHorizontal" // 指定为水平进度条,不指定时默认为圆形进度条
            android:max="100"/>
    
    • AlertDialog
    // 必须手动创建?
     AlertDialog.Builder dialog = new AlertDialog.Builder(MainActivity.this);
            dialog.setTitle("exit?");
            dialog.setMessage("confirm");
            dialog.setCancelable(false);
            dialog.setPositiveButton("OK", new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialogInterface, int i) {
    
                }
            });
            dialog.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialogInterface, int i) {
    
                }
            });
            dialog.show();
    

    2、基本布局

    • 线性布局 LinearLayout
      1、默认水平布局,可通过 orientation 属性改成垂直方向
    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical" android:layout_width="match_parent"
        android:layout_height="match_parent">
    
    </LinearLayout>
    

    2、LinearLayout 中的控件使用 android:layout_weight 可以按比例分类占据的大小

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="horizontal" android:layout_width="match_parent"
        android:layout_height="match_parent">
        <TextView
            android:layout_width="0dp" // 使用 layout_weight 时,对应宽度设为0dp
            android:layout_height="wrap_content" 
            android:layout_weight="1"/>
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"/>
    </LinearLayout>
    
    • 相对布局 RelativeLayout
    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="horizontal" android:layout_width="match_parent"
        android:layout_height="match_parent">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"/> // 可用属性
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"/> // 可用属性
    </RelativeLayout>
    
    • 帧布局 FrameLayout
      所有控件默认摆放在桌面左上角,这种布局使用场景较少
    • 百分比布局
      上面三种布局只有线性布局有按比例控制大小的能力,为了扩展,引入了新的百分比布局:PercentRelativeLayout 和 PercentFrameLayout。
      使用方式:

    1、引入新的布局包

    // app/build.gradle
    dependencies{
    ...
    compile "com.android.support:percent:24.2.1"
    ...
    }
    

    2、Sync 一下
    3、用 android.support.percent.PercentRelativeLayout 代替 RelativeLayout
    4、子组件可以用 android:layout_widthPercent="50%" 设置宽度

    3、ListView & RecyclerView

    • ListView 基本用法

    1、写布局

    <?xml version="1.0" encoding="utf-8"?>
    <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">
    
        <ListView
            android:id="@+id/list_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
        </ListView>
    </androidx.constraintlayout.widget.ConstraintLayout>
    

    2、创建数据并填充
    先创建一个 adapter , 然后给listView实例设置adapter即可

    public class MainActivity extends AppCompatActivity {
    
        private String[] data = {"a","b","c","a","b","c","a","b","c","a","b","c","a","b","c","a","b","c"};
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            ArrayAdapter<String> adapter = new ArrayAdapter<String>(MainActivity.this,android.R.layout.simple_list_item_1,data); // simple_list_item_1 是控件内置的布局,里面只有一个 TextView
            ListView listView = (ListView) findViewById(R.id.list_view);
            listView.setAdapter(adapter);
        }
    }
    

    可以使用 LayoutInflater.from(getContext()).inflate(resourceId,parent,false) 来动态获取子布局
    3、加入点击事件 setOnItemClickListener

    public class MainActivity extends AppCompatActivity {
    
        private String[] data = {"a","b","c","a","b","c","a","b","c","a","b","c","a","b","c","a","b","c"};
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            ArrayAdapter<String> adapter = new ArrayAdapter<String>(MainActivity.this,android.R.layout.simple_list_item_1,data);
            ListView listView = (ListView) findViewById(R.id.list_view);
            listView.setAdapter(adapter);
            listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
                @Override
                public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
                    String item = data[i];
                    Toast.makeText(MainActivity.this,item,Toast.LENGTH_LONG).show();
                }
            });
        }
    }
    
    
    • RecyclerView
      目前官方推荐使用这个代替 ListView。性能好,扩展性强,基本可以不用 ListView 了
      1、RecyclerView 属于新增控件,所以为了让其兼容所有Android 系统,RecyclerView被定义在了 support 库中,所以需要单独引入依赖库
    dependencies{
    ...
    compile 'com.android.support:recyclerview-v7:24.2.1'
    ...
    }
    

    2、写布局

    <?xml version="1.0" encoding="utf-8"?>
    <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">
    
        <android.support.v7.widget.RecyclerView
            android:id="@+id/recycler_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
        </android.support.v7.widget.RecyclerView>
    </androidx.constraintlayout.widget.ConstraintLayout>
    

    3、准备数据 & 设置点击事件大同小异

    相关文章

      网友评论

          本文标题:Android 控件及布局

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