devbox
笔触狂放9
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

Android Studio应用基础，手把手教你从入门到精通（小白学习）总结2 之 常用界面布局和ListView_android studio tools:context

作者：笔触狂放9 | 2024-04-07 07:47:12

赞

踩

android studio tools:context

总结1链接：

(156条消息) Android Studio应用基础，手把手教你从入门到精通（小白学习）总结1_好喜欢吃红柚子的博客-CSDN博客

学习视频链接： 

（学完必会）Android studio基础，从入门到精通，学完小白也能会_哔哩哔哩_bilibili

目录

五、常见界面布局

1. LinearLayout布局

1.1 orientation属性：决定控件的排列方式 

1.2 layout_gravity：决定控件在布局中的对齐方式

1.3 gravity：决定文字在控件中的对齐方式

1.4 weight 权重

 2. RelativeLayout相对布局

 2.1 根据布局定位的位置属性

2.2 根据其他控件定位的位置属性​​​​​​​

3. ConstraintLayout布局

4. 自定义布局

4.1 自定义布局的书写

4.2 在主布局中引用自定义布局

4.3 隐藏系统自带标题栏

5、TableLayout行列布局 

六、水平和竖直滚动条

1. HorizentalScrollView 水平滚动条

2. 垂直滚动条ScrollView

七、ListView滚动菜单

1. 滚动菜单ListView的简单应用

2. 定制ListView界面

3.实现ListView的点击事件

五、常见界面布局

1. LinearLayout布局

LinearLayout布局的语法格式为

  1. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2.     xmlns:app="http://schemas.android.com/apk/res-auto"
  3.     xmlns:tools="http://schemas.android.com/tools"
  4.     android:layout_width="match_parent"
  5.     android:layout_height="match_parent"
  6.     tools:context=".MainActivity"
  7.     android:orientation="horizontal"
  8.     >
  9.  
  10. ……
  11.  
  12. </LinearLayout>

1.1 orientation属性：决定控件的排列方式 

 android:orientation="horizontal" 或者 “vertical”

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     xmlns:app="http://schemas.android.com/apk/res-auto"
  4.     xmlns:tools="http://schemas.android.com/tools"
  5.     android:layout_width="match_parent"
  6.     android:layout_height="match_parent"
  7.     tools:context=".MainActivity"
  8.     android:orientation="horizontal"
  9.     >

                   

            horizontal 水平排列                                                               vertical 垂直排列

如果不指定orientation的值，默认排列方式是horizontal。

  • 若排列方式为horizontal，则不能指定宽度为match-parent，因为一个按钮的宽度就会把整个屏幕占满，出现下图1所示情况
  • 若排列方式为vertical，则不能指定高度为match-parent，因为一个按钮的高度就会把整个屏幕占满，出现下图2所示情况

                                                                 1                                                                            2                   

1.2 layout_gravity：决定控件在布局中的对齐方式

  1. <Button
  2.         android:id="@+id/b1"
  3.         android:layout_width="wrap_content"
  4.         android:layout_height="wrap_content"
  5.         android:layout_gravity="top"
  6.         android:text="按钮1"
  7.         />
  8.  
  9.     <Button
  10.         android:id="@+id/b2"
  11.         android:layout_width="wrap_content"
  12.         android:layout_height="wrap_content"
  13.         android:layout_gravity="center_vertical"
  14.         android:text="按钮2"
  15.         />
  16.     <Button
  17.         android:id="@+id/b3"
  18.         android:layout_width="wrap_content"
  19.         android:layout_height="wrap_content"
  20.         android:layout_gravity="bottom"
  21.         android:text="按钮3"
  22.         />

效果：

1.3 gravity：决定文字在控件中的对齐方式

  •  把button2的文字对齐方式改为bottom
  • android:gravity="right|bottom" 组合使用
  1.  <Button
  2.         android:id="@+id/b2"
  3.         android:layout_width="wrap_content"
  4.         android:layout_height="wrap_content"
  5.         android:layout_gravity="center_vertical"
  6.         android:gravity="bottom"
  7.         android:text="按钮2"
  8.         />

效果：        

1.4 weight 权重

（1）作用：可以使布局内的控件按照权重比显示大小，起到屏幕适配的重要作用

因为使用了权重weight属性，所以可以将控件的宽度设置为0dp，此时的宽度由权重值决定

（2）应用：

  •  设置两个控件的权重均为1，则屏幕会按1:1比例为控件分配大小
  1. <EditText
  2.         android:id="@+id/input1"
  3.         android:layout_width="0dp"
  4.         android:layout_height="wrap_content"
  5.         android:layout_weight="1"
  6.         android:hint="请输入信息"></EditText>
  7.  
  8.     <Button
  9.         android:id="@+id/send"
  10.         android:layout_width="0dp"
  11.         android:layout_height="wrap_content"
  12.         android:layout_weight="1"
  13.         android:text="发送"
  14.         />

效果如下图1所示。

  • 设置输入框的权重为1，设置按钮的宽度为wrap-content，则可如图2效果所示，为常用的手机布局设置。
  1.  
  2.     <EditText
  3.         android:id="@+id/input1"
  4.         android:layout_width="0dp"
  5.         android:layout_height="wrap_content"
  6.         android:layout_weight="1"
  7.         android:hint="请输入信息"></EditText>
  8.  
  9.     <Button
  10.         android:id="@+id/send"
  11.         android:layout_width="wrap_content"
  12.         android:layout_height="wrap_content"
  13.         android:text="发送"
  14.         />
  15.

                                                                           1                                                                      2

 2. RelativeLayout相对布局

语法如下： 

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     xmlns:app="http://schemas.android.com/apk/res-auto"
  4.     xmlns:tools="http://schemas.android.com/tools"
  5.     android:layout_width="match_parent"
  6.     android:layout_height="match_parent"
  7.     tools:context=".MainActivity"
  8.     >
  9.  
  10. </RelativeLayout>

 2.1 根据布局定位的位置属性

为5个按钮分别设置不同的页面效果。

  • android:layout_alignParentLeft="true"     设置当前控件与父布局左对齐
  • android:layout_alignParentTop="true"      设置当前控件与父布局顶端对齐
  • android:layout_centerInParent="true"      设置当前控件位于父布局的中央位置 
  1. <Button
  2.         android:id="@+id/b1"
  3.         android:layout_width="wrap_content"
  4.         android:layout_height="wrap_content"
  5.         android:layout_alignParentLeft="true"
  6.         android:layout_alignParentTop="true"
  7.         android:text="按钮1"></Button>
  8.  
  9.     <Button
  10.         android:id="@+id/b2"
  11.         android:layout_width="wrap_content"
  12.         android:layout_height="wrap_content"
  13.         android:layout_alignParentRight="true"
  14.         android:layout_alignParentTop="true"
  15.         android:text="按钮2"></Button>
  16.  
  17.     <Button
  18.         android:id="@+id/b3"
  19.         android:layout_width="wrap_content"
  20.         android:layout_height="wrap_content"
  21.         android:layout_centerInParent="true"
  22.         android:text="按钮3"></Button>
  23.  
  24.     <Button
  25.         android:id="@+id/b4"
  26.         android:layout_width="wrap_content"
  27.         android:layout_height="wrap_content"
  28.         android:layout_alignParentBottom="true"
  29.         android:layout_alignParentRight="true"
  30.         android:text="按钮4"></Button>
  31.  
  32.     <Button
  33.         android:id="@+id/b5"
  34.         android:layout_width="wrap_content"
  35.         android:layout_height="wrap_content"
  36.         android:layout_alignParentBottom="true"
  37.         android:layout_alignParentLeft="true"
  38.         android:text="按钮5"></Button>

效果：

2.2 根据其他控件定位的位置属性

让按钮1,2,4,5根据按钮3进行位置的排列 

  •  android:layout_above="@+id/b3"       此控件在b3之上
  •  android:layout_toLeftOf="@+id/b3"    此控件在b3左边
  • android:layout_below="@+id/b3"        此控件在b3之下
  • android:layout_toRightOf="@+id/b3"   此控件在b3右边
  1. <Button
  2.         android:id="@+id/b1"
  3.         android:layout_width="wrap_content"
  4.         android:layout_height="wrap_content"
  5.         android:layout_above="@+id/b3"
  6.         android:layout_toLeftOf="@+id/b3"
  7.         android:text="按钮1"></Button>
  8.  
  9.     <Button
  10.         android:id="@+id/b2"
  11.         android:layout_width="wrap_content"
  12.         android:layout_height="wrap_content"
  13.         android:layout_above="@+id/b3"
  14.         android:layout_toRightOf="@+id/b3"
  15.         android:text="按钮2"></Button>
  16.  
  17.     <Button
  18.         android:id="@+id/b3"
  19.         android:layout_width="wrap_content"
  20.         android:layout_height="wrap_content"
  21.         android:layout_centerInParent="true"
  22.         android:text="按钮3"></Button>
  23.  
  24.     <Button
  25.         android:id="@+id/b4"
  26.         android:layout_width="wrap_content"
  27.         android:layout_height="wrap_content"
  28.         android:layout_below="@+id/b3"
  29.         android:layout_toLeftOf="@+id/b3"
  30.         android:text="按钮4"></Button>
  31.  
  32.     <Button
  33.         android:id="@+id/b5"
  34.         android:layout_width="wrap_content"
  35.         android:layout_height="wrap_content"
  36.         android:layout_below="@+id/b3"
  37.         android:layout_toRightOf="@+id/b3"
  38.         android:text="按钮5"></Button>

效果：

3. ConstraintLayout布局

语法格式如下： 

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     xmlns:app="http://schemas.android.com/apk/res-auto"
  4.     xmlns:tools="http://schemas.android.com/tools"
  5.     android:layout_width="match_parent"
  6.     android:layout_height="match_parent"
  7.     tools:context=".MainActivity"
  8.     >
  9.  
  10.     
  11.  
  12. </androidx.constraintlayout.widget.ConstraintLayout>

4. 自定义布局

4.1 自定义布局的书写

  • 新建一个布局文件title.xml，导入需要的按钮和背景的图片，把自定义标题栏写好
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:layout_width="match_parent"
  4.     android:layout_height="wrap_content"
  5.     android:orientation="horizontal"
  6.     android:background="@drawable/bb3">
  7.  
  8.     <Button
  9.         android:id="@+id/title_back"
  10.         android:layout_width="0dp"
  11.         android:layout_height="wrap_content"
  12.         android:layout_margin="5dp"
  13.         android:layout_weight="1"
  14.         android:background="@drawable/bb1"
  15.         android:gravity="center"
  16.         android:text="Back"
  17.         android:textColor="#ffff"></Button>
  18.  
  19.     <TextView
  20.         android:id="@+id/title_text"
  21.         android:layout_width="0dp"
  22.         android:layout_height="wrap_content"
  23.         android:layout_weight="1"
  24.         android:gravity="center"
  25.         android:text="title text"
  26.         android:textColor="#fff"
  27.         android:textSize="24sp"></TextView>
  28.  
  29.     <Button
  30.         android:id="@+id/title_edit"
  31.         android:layout_width="0"
  32.         android:layout_height="wrap_content"
  33.         android:layout_weight="1"
  34.         android:layout_margin="5dp"
  35.         android:background="@drawable/bb2"
  36.         android:gravity="center"
  37.         android:text="edit"
  38.         android:textColor="#ffff"></Button>
  39.  
  40. </LinearLayout>
  • 在写标题栏过程中为防止出现控件文字不显示问题，把values文件夹目录下的themes.xml文件改为如下语句。
  1. <resources xmlns:tools="http://schemas.android.com/tools">
  2.     <!-- Base application theme. -->
  3.     <style name="Theme.Layout" parent="Theme.MaterialComponents.DayNight.DarkActionBar.Bridge">
  4.         <!-- Primary brand color. -->
  5.         <item name="colorPrimary">@color/purple_500</item>
  6.         <item name="colorPrimaryVariant">@color/purple_700</item>
  7.         <item name="colorOnPrimary">@color/white</item>
  8.         <!-- Secondary brand color. -->
  9.         <item name="colorSecondary">@color/teal_200</item>
  10.         <item name="colorSecondaryVariant">@color/teal_700</item>
  11.         <item name="colorOnSecondary">@color/black</item>
  12.         <!-- Status bar color. -->
  13.         <item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
  14.         <!-- Customize your theme here. -->
  15.     </style>
  16. </resources>

效果如下（有点丑）

4.2 在主布局中引用自定义布局

在main_activity.xml文件中插入如下语句：

<!--    引入自定义布局-->
    <include layout="@layout/title" ></include>

表示将自定义布局引入该布局中。 

效果如下：

4.3 隐藏系统自带标题栏

在main_activity.java中使用ActionBar完成对系统标题栏的隐藏，具体使用方法后续会讲解~ 

  1. package cn.edu.sdut.layout;
  2.  
  3. import androidx.appcompat.app.ActionBar;
  4. import androidx.appcompat.app.AppCompatActivity;
  5.  
  6. import android.app.Notification;
  7. import android.os.Bundle;
  8.  
  9. public class MainActivity extends AppCompatActivity {
  10.  
  11.     @Override
  12.     protected void onCreate(Bundle savedInstanceState) {
  13.         super.onCreate(savedInstanceState);
  14.         setContentView(R.layout.activity_main);
  15.         ActionBar actionBar = getSupportActionBar();
  16.         if(actionBar!=null){
  17.             actionBar.hide();
  18.         }
  19.     }
  20. }

成功隐藏系统标题栏：

5、TableLayout行列布局 

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:layout_width="match_parent"
  4.     android:layout_height="match_parent">
  5.  
  6.     <Button
  7.         android:id="@+id/login"
  8.         android:gravity="center"
  9.         android:layout_centerInParent="true"
  10.         android:layout_width="wrap_content"
  11.         android:layout_height="wrap_content"
  12.         android:text="@string/loginTxt"/>
  13.  
  14.     <TableLayout
  15.         android:layout_above="@+id/login"
  16.         android:shrinkColumns="0"
  17.         android:stretchColumns="1"
  18.         android:layout_width="match_parent"
  19.         android:layout_height="wrap_content">
  20.  
  21.         <TableRow
  22.             android:layout_width="match_parent"
  23.             android:layout_height="wrap_content">
  24.  
  25.             <TextView
  26.                 android:layout_marginLeft="10dp"
  27.                 android:layout_width="wrap_content"
  28.                 android:layout_height="wrap_content"
  29.                 android:text="@string/name">
  30.  
  31.             </TextView>
  32.  
  33.             <EditText
  34.                 android:id="@+id/txt_user"
  35.                 android:layout_marginRight="10dp"
  36.                 android:layout_width="match_parent"
  37.                 android:layout_height="wrap_content"/>
  38.  
  39.         </TableRow>
  40.  
  41.         <TableRow
  42.             android:layout_width="match_parent"
  43.             android:layout_height="wrap_content">
  44.  
  45.             <TextView
  46.                 android:layout_marginLeft="10dp"
  47.                 android:layout_width="wrap_content"
  48.                 android:layout_height="wrap_content"
  49.                 android:text="@string/psw">
  50.  
  51.             </TextView>
  52.  
  53.             <EditText
  54.                 android:id="@+id/txt_psw"
  55.                 android:layout_marginRight="10dp"
  56.                 android:layout_width="match_parent"
  57.                 android:layout_height="wrap_content"/>
  58.  
  59.         </TableRow>
  60.  
  61.     </TableLayout>
  62.  
  63.  
  64.  
  65.  
  66. </RelativeLayout>

六、水平和竖直滚动条

1. HorizentalScrollView 水平滚动条

水平滚动条只能包含一个视图，因此不能直接把多个按钮放进去，所以需要先新建一个linear布局的视图，把五个按钮放进去，再把linear布局放在水平滚动条内，即可

  • 结构：
  1. <?xml version="1.0" encoding="utf-8"?>
  2.  
  3. 1. 第一层：线性布局大框架
  4.  
  5. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  6.     android:orientation="horizontal"
  7.     android:layout_width="match_parent"
  8.     android:layout_height="match_parent"
  9.     >
  10.  
  11.     2.第二层：水平滚动条部件
  12.  
  13.     <HorizontalScrollView
  14.         android:layout_width="wrap_content"
  15.         android:layout_height="wrap_content">
  16.  
  17.           3. 第三层：线性布局容器，用来装按钮
  18.  
  19.           <LinearLayout
  20.                 android:layout_width="wrap_content"
  21.                 android:layout_height="wrap_content"
  22.                 android:orientation="horizontal">
  23.  
  24.     
  25.                       4. 放置多个按钮
  26.  
  27.  
  28.            </LinearLayout>
  29.  
  30.  
  31.     </HorizontalScrollView>
  32.  
  33. </LinearLayout>

  • 代码：
  1. <?xml version="1.0" encoding="utf-8"?>
  2.  
  3. <!--
  4. 权重：控制宽度
  6. -->
  7.  
  8. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  9.     android:orientation="horizontal"
  10.     android:layout_width="match_parent"
  11.     android:layout_height="match_parent"
  12.     >
  13.  
  14. <!--    水平滚动条只能包含一个视图，所以需要先新建一个linear的视图，把五个按钮放进去，
  15. 再把linear放在水平滚动条内，即可-->
  16.  
  17.     <HorizontalScrollView
  18.         android:layout_width="wrap_content"
  19.         android:layout_height="wrap_content">
  20.  
  21. <LinearLayout
  22.     android:layout_width="wrap_content"
  23.     android:layout_height="wrap_content"
  24.     android:orientation="horizontal">
  25.  
  26.     <Button
  27.         android:id="@+id/button1"
  28.         android:layout_width="wrap_content"
  29.         android:layout_height="wrap_content"
  30.  
  31.         android:text="Button" />
  32.  
  33.     <!--&lt;!&ndash;    使用view给按钮添加间隔&ndash;&gt;-->
  34.     <!--    <View-->
  35.     <!--        android:layout_width="0dp"-->
  36.     <!--        android:layout_weight="1"-->
  37.     <!--        android:layout_height="wrap_content"></View>-->
  38.  
  39.  
  40.     <Button
  41.         android:id="@+id/button2"
  42.         android:layout_width="wrap_content"
  43.         android:layout_height="wrap_content"
  44.  
  45.         android:text="Button" />
  46.  
  47.     <Button
  48.         android:id="@+id/button3"
  49.         android:layout_width="wrap_content"
  50.         android:layout_height="wrap_content"
  51.         android:text="Button" />
  52.  
  53.     <Button
  54.         android:id="@+id/button4"
  55.         android:layout_width="wrap_content"
  56.         android:layout_height="wrap_content"
  57.  
  58.         android:text="Button" />
  59.  
  60.     <Button
  61.         android:id="@+id/button5"
  62.         android:layout_width="wrap_content"
  63.         android:layout_height="wrap_content"
  64.         android:text="Button" />
  65.  
  66. </LinearLayout>
  67.  
  68.  
  69.     </HorizontalScrollView>
  70.  
  71. </LinearLayout>

2. 垂直滚动条ScrollView

ScrollView在最外层，要有xmlns的这个语句，因为这个语句是唯一的，而且只能且必须加在最外层框架的头标签里。

xmlns:android="http://schemas.android.com/apk/res/android"

结构：

  1.  
  2.  
  3. <?xml version="1.0" encoding="utf-8"?>
  4.  
  5.  
  6. <!--xmlns给scrollview，因为这句话只有最外层的容器有-->
  7.  
  8. 1. ScrollView，在最外层 
  9.  
  10. <ScrollView
  11.     xmlns:android="http://schemas.android.com/apk/res/android"
  12.     android:layout_width="wrap_content"
  13.     android:layout_height="wrap_content"
  14.     >
  15.  
  16.       2. 线性布局容器，装按钮
  17.  
  18.     <LinearLayout
  19.         android:orientation="vertical"
  20.         android:layout_width="match_parent"
  21.         android:layout_height="match_parent"
  22.         >
  23.  
  24.         
  25.             3. 放置多个按钮
  26.  
  27.  
  28.     </LinearLayout>
  29.  
  30. </ScrollView>

代码：

  1. <?xml version="1.0" encoding="utf-8"?>
  2.  
  3. <!--
  4. 权重：控制宽度
  6. -->
  7.  
  8. <!--xmlns给scrollview，因为这句话只有最外层的容器有-->
  9. <ScrollView
  10.     xmlns:android="http://schemas.android.com/apk/res/android"
  11.     android:layout_width="wrap_content"
  12.     android:layout_height="wrap_content"
  13.     >
  14.  
  15.     <LinearLayout
  16.         android:orientation="vertical"
  17.         android:layout_width="match_parent"
  18.         android:layout_height="match_parent"
  19.         >
  20.  
  21.         <Button
  22.             android:layout_width="wrap_content"
  23.             android:layout_height="100dp">
  24.  
  25.         </Button>
  26.         <Button
  27.             android:layout_width="wrap_content"
  28.             android:layout_height="100dp">
  29.  
  30.         </Button>
  31.         <Button
  32.             android:layout_width="wrap_content"
  33.             android:layout_height="100dp">
  34.  
  35.         </Button>
  36.         <Button
  37.             android:layout_width="wrap_content"
  38.             android:layout_height="100dp">
  39.  
  40.         </Button>
  41.         <Button
  42.             android:layout_width="wrap_content"
  43.             android:layout_height="100dp">
  44.  
  45.         </Button>
  46.         <Button
  47.             android:layout_width="wrap_content"
  48.             android:layout_height="100dp">
  49.  
  50.         </Button>
  51.         <Button
  52.             android:layout_width="wrap_content"
  53.             android:layout_height="100dp">
  54.  
  55.         </Button>
  56.         <Button
  57.             android:layout_width="wrap_content"
  58.             android:layout_height="100dp">
  59.  
  60.         </Button>
  61.         <Button
  62.             android:layout_width="wrap_content"
  63.             android:layout_height="100dp">
  64.  
  65.         </Button>
  66.  
  67.  
  68.     </LinearLayout>
  69.  
  70. </ScrollView>

七、ListView滚动菜单

新建一个名为ListView的项目，完成后续操作。

1. 滚动菜单ListView的简单应用

  •  在布局文件中定义一个滚动菜单
  1. <ListView
  2.         android:id="@+id/list_view"
  3.         android:layout_width="wrap_content"
  4.         android:layout_height="wrap_content"
  5.         />
  •  在MainActivity.java文件中进行对显示数据和适配器的定义

String类型的fruit数组存储了菜单想要显示的内容

数组中的数组无法直接传递给ListView，因此需要借助适配器完成，使用ArrayAdapter完成数据对ListView的传输，适配器的构造函数中需要其次传入三个参数：

  • 所处的activity
  • Android自带的xml文件的构造文字的容器
  • 想要输出的内容。

最后使用setAdapter方法给滚动菜单配置上刚刚定义的配适器

  1. package cn.edu.sdut.listview;
  2.  
  3. import androidx.appcompat.app.AppCompatActivity;
  4.  
  5. import android.os.Bundle;
  6. import android.widget.ArrayAdapter;
  7. import android.widget.ListView;
  8.  
  9. public class MainActivity extends AppCompatActivity {
  10.  
  11. //    数组存取listview想要展示的信息
  12.     private String[] fruit ={"apple","banana","orange","watermelon",
  13.             "pear","grape","strawberry","cherry","mango","Coconut","tomato","lemon",
  14.         "apple","banana","orange","watermelon", "pear","grape","strawberry","cherry",
  15.         "mango","Coconut"};
  16.  
  17.     @Override
  18.     protected void onCreate(Bundle savedInstanceState) {
  19.         super.onCreate(savedInstanceState);
  20.         setContentView(R.layout.activity_main);
  21.  
  22. //        配置适配器
  23.         ArrayAdapter<String> adapter = new ArrayAdapter<String>
  24.                 (MainActivity.this, android.R.layout.simple_list_item_1,fruit);
  25.  
  26.         ListView listView = (ListView) findViewById(R.id.list_view);
  27.         listView.setAdapter(adapter);
  28.     }
  29. }

效果如下：

2. 定制ListView界面

实现水果图片和对应水果名称匹配一起在滚动列表中显示。

  • 新建Fruit.java类，进行水果名和水果图片名称的实体类编写
  1. package cn.edu.sdut.listview;
  2.  
  3. public class Fruit {
  4.     private String name;
  5.     private int imageId;
  6.  
  7.     public Fruit(String name, int imageId) {
  8.         this.name = name;
  9.         this.imageId = imageId;
  10.     }
  11.  
  12.     public String getName() {
  13.         return name;
  14.     }
  15.  
  16.     public int getimageId() {
  17.         return imageId;
  18.     }
  19. }
  •  定义水果适配器FruitAdaptor.java
  1. package cn.edu.sdut.listview;
  2.  
  3. import android.content.Context;
  4. import android.view.LayoutInflater;
  5. import android.view.View;
  6. import android.view.ViewGroup;
  7. import android.widget.ArrayAdapter;
  8. import android.widget.ImageView;
  9. import android.widget.TextView;
  10.  
  11. import java.util.List;
  12.  
  13. public class FruitAdapter extends ArrayAdapter<Fruit> {
  14.     private int resourceId;
  15.  
  16.     public FruitAdapter(Context context, int textViewResourceId, List<Fruit> object){
  17.         super(context,textViewResourceId,object);
  18.         resourceId = textViewResourceId;
  19.  
  20.     }
  21.  
  22.     public View getView(int position, View coverView, ViewGroup parent){
  23.         Fruit fruit = getItem(position);
  24.         View view = LayoutInflater.from(getContext()).inflate(resourceId,parent,false);
  25.         ImageView fruitImage = (ImageView) view.findViewById(R.id.fruit_image);
  26.         TextView fruitName = (TextView) view.findViewById(R.id.fruit_name);
  27.         fruitImage.setImageResource(fruit.getimageId());
  28.         fruitName.setText(fruit.getName());
  29.         return view;
  30.     }
  31.  
  32. }
  •  对主活动进行编写MainActivity.java进行编写

     1. 新建一个水果类的列表，进行对水果名和水果图片名的存储

     2. 使用initFruit方法进行对列表元素的添加

     3. 把适配器给滚动列表set上

  1. package cn.edu.sdut.listview;
  2.  
  3. import androidx.appcompat.app.AppCompatActivity;
  4.  
  5. import android.os.Bundle;
  6. import android.widget.ArrayAdapter;
  7. import android.widget.ListView;
  8.  
  9. import java.util.ArrayList;
  10. import java.util.List;
  11.  
  12. public class MainActivity extends AppCompatActivity {
  13.  
  14.     private List<Fruit> fruitList = new ArrayList<>();
  15.  
  16.     @Override
  17.     protected void onCreate(Bundle savedInstanceState) {
  18.         super.onCreate(savedInstanceState);
  19.         setContentView(R.layout.activity_main);
  20.  
  21.         initFruits();
  22.         
  23.         FruitAdapter adapter = new FruitAdapter(MainActivity.this,R.layout.fruit_item,fruitList);
  24.         ListView listView = (ListView) findViewById(R.id.list_view);
  25.         listView.setAdapter(adapter);
  26.  
  27.  
  28.     }
  29.  
  30. //把水果名称和对应图片加入信息列表
  31.     private void initFruits(){
  32.         for(int i=0;i<2;i++){
  33.             Fruit apple = new Fruit("apple",R.drawable.apple);
  34.             fruitList.add(apple);
  35.             Fruit banana = new Fruit("banana",R.drawable.banana);
  36.             fruitList.add(banana);
  37.             Fruit orange = new Fruit("orange",R.drawable.orange);
  38.             fruitList.add(orange);
  39.             Fruit watermelon = new Fruit("watermelon",R.drawable.watermelon);
  40.             fruitList.add(watermelon);
  41.             Fruit pear= new Fruit("pear",R.drawable.pear);
  42.             fruitList.add(pear);
  43.             Fruit grape = new Fruit("grape",R.drawable.grape);
  44.             fruitList.add(grape);
  45.             Fruit strawberry = new Fruit("strawberry",R.drawable.stawberry);
  46.             fruitList.add(strawberry);
  47.             Fruit cherry = new Fruit("cherry",R.drawable.cherry);
  48.             fruitList.add(cherry);
  49.             Fruit mango = new Fruit("mango",R.drawable.mango);
  50.             fruitList.add(mango);
  51.             Fruit coconut = new Fruit("coconut",R.drawable.coconut);
  52.             fruitList.add(coconut);
  53.             Fruit tomato = new Fruit("tomato",R.drawable.tomato);
  54.             fruitList.add(tomato);
  55.             Fruit lemon = new Fruit("lemon",R.drawable.lemon);
  56.             fruitList.add(lemon);
  57.         }
  58.     }
  59.  
  60. }

效果如下：

3.实现ListView的点击事件

  • 使用setOnItemListener方法为滚动菜单设置点击事件
  • onItemClick方法参数中的 i 为点击到的具体元素
  • 使用toast方法将点击到的水果名弹窗显示

在主活动中添加如下代码 

 代码：

  1. package cn.edu.sdut.listview;
  2.  
  3. import androidx.appcompat.app.AppCompatActivity;
  4.  
  5. import android.os.Bundle;
  6. import android.view.View;
  7. import android.widget.AdapterView;
  8. import android.widget.ArrayAdapter;
  9. import android.widget.ListView;
  10. import android.widget.Toast;
  11.  
  12. import java.util.ArrayList;
  13. import java.util.List;
  14.  
  15. public class MainActivity extends AppCompatActivity {
  16.  
  17.  
  18.     private List<Fruit> fruitList = new ArrayList<>();
  19.  
  20.     @Override
  21.     protected void onCreate(Bundle savedInstanceState) {
  22.         super.onCreate(savedInstanceState);
  23.         setContentView(R.layout.activity_main);
  24.  
  25. //为fruitList列表添加元素
  26.         initFruits();
  27.  
  28.         FruitAdapter adapter = new FruitAdapter(MainActivity.this,R.layout.fruit_item,fruitList);
  29.         ListView listView = (ListView) findViewById(R.id.list_view);
  30.         listView.setAdapter(adapter);
  31.  
  32. //       设置点击事件
  33.         listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
  34.             @Override
  35.             public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
  36.                 Fruit fruit = fruitList.get(i);
  37.                 Toast.makeText(MainActivity.this,fruit.getName(), Toast.LENGTH_SHORT).show();
  38.             }
  39.         });
  40.  
  41.  
  42.     }
  43.  
  44. //把水果名称和对应图片加入信息列表
  45.     private void initFruits(){
  46. //        为了让滚动列表中多显示一些元素，所以添加两遍重复的内容
  47.         for(int i=0;i<2;i++){
  48.             Fruit apple = new Fruit("apple",R.drawable.apple);
  49.             fruitList.add(apple);
  50.             Fruit banana = new Fruit("banana",R.drawable.banana);
  51.             fruitList.add(banana);
  52.             Fruit orange = new Fruit("orange",R.drawable.orange);
  53.             fruitList.add(orange);
  54.             Fruit watermelon = new Fruit("watermelon",R.drawable.watermelon);
  55.             fruitList.add(watermelon);
  56.             Fruit pear= new Fruit("pear",R.drawable.pear);
  57.             fruitList.add(pear);
  58.             Fruit grape = new Fruit("grape",R.drawable.grape);
  59.             fruitList.add(grape);
  60.             Fruit strawberry = new Fruit("strawberry",R.drawable.stawberry);
  61.             fruitList.add(strawberry);
  62.             Fruit cherry = new Fruit("cherry",R.drawable.cherry);
  63.             fruitList.add(cherry);
  64.             Fruit mango = new Fruit("mango",R.drawable.mango);
  65.             fruitList.add(mango);
  66.             Fruit coconut = new Fruit("coconut",R.drawable.coconut);
  67.             fruitList.add(coconut);
  68.             Fruit tomato = new Fruit("tomato",R.drawable.tomato);
  69.             fruitList.add(tomato);
  70.             Fruit lemon = new Fruit("lemon",R.drawable.lemon);
  71.             fruitList.add(lemon);
  72.         }
  73.     }
  74.  
  75. }

效果：

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/笔触狂放9/article/detail/377308
推荐阅读
相关标签

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。

  

闽ICP备14008679号