day_03 UI_02_ListView

ListView：是平常用的最多的，就是可以用手滑动屏幕，来滚动数据。

　　方法一：

　　在activity_main里添加ListView，设置上id

 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 2               android:orientation="vertical"
 3               android:layout_width="match_parent"
 4               android:layout_height="match_parent">
 5 
 6   <ListView
 7       android:id="@+id/my_listView"
 8       android:layout_width="match_parent"
 9       android:layout_height="wrap_content"
10        />
11 
12 
13 
14 
15 </LinearLayout>

　　在MainActivity里获取ListView，这里又用ArrayAdapter，R.layout.layout_my和R.id.text_my是自己创建的布局，new String[]里是显示在屏幕上的数据，多弄几个才可以看的出这是可以滑动的。

　　 用my_listView.setAdapter(adapter);添加适配器

 1 public class MainActivity extends AppCompatActivity {
 2 
 3     @Override
 4     protected void onCreate(Bundle savedInstanceState) {
 5         super.onCreate(savedInstanceState);
 6         setContentView(R.layout.activity_main);
 7 
 8         ListView my_listView = (ListView) findViewById(R.id.my_listView);
 9         ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,R.layout.layout_my,
10                 R.id.text_my,new String[]{"狗","猫","老虎","狮子","长颈鹿","猫","老虎","狮子","长颈鹿","猫","老虎","狮子"
11                 ,"长颈鹿","猫","老虎","狮子","长颈鹿","猫","老虎","狮子","长颈鹿","猫","老虎","狮子","长颈鹿"});
12         my_listView.setAdapter(adapter);
13     }

　　自己创建的布局：

 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 2               android:orientation="vertical"
 3               android:layout_width="match_parent"
 4               android:layout_height="match_parent">
 5     <TextView
 6         android:id="@+id/text_my"
 7         android:layout_width="wrap_content"
 8         android:layout_height="wrap_content"
 9         android:layout_gravity="center"
10         android:textSize="20dp"
11         />
12 
13 </LinearLayout>

　　运行：这里是可以上下滑动的

　　方法二：把MainActivity里的那些注释掉

扫描二维码关注公众号，回复： 2624691 查看本文章

 1 public class MainActivity extends AppCompatActivity {
 2 
 3     @Override
 4     protected void onCreate(Bundle savedInstanceState) {
 5         super.onCreate(savedInstanceState);
 6         setContentView(R.layout.activity_main);
 7 
 8         /*ListView my_listView = (ListView) findViewById(R.id.my_listView);
 9         ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,R.layout.layout_my,
10                 R.id.text_my,new String[]{"狗","猫","老虎","狮子","长颈鹿","猫","老虎","狮子","长颈鹿","猫","老虎","狮子"
11                 ,"长颈鹿","猫","老虎","狮子","长颈鹿","猫","老虎","狮子","长颈鹿","猫","老虎","狮子","长颈鹿"});
12         my_listView.setAdapter(adapter);*/
13     }
14 }

　　activity_main使用entries

1 <ListView
2       android:id="@+id/my_listView"
3       android:layout_width="match_parent"
4       android:layout_height="wrap_content"
5        android:entries="@array/animal"/>

　　@array/animal是自己在values里建的字符串数组。自己右击values新建一个xml，里面码上这些内容。

自己定制ListView

　　需求：定制一款既有图片又有文字的ListView

　　（1）先定义一个类，叫Animal，类里面有两个属性，String类型的名字和int类型的图片的id。

 1 public class Animal  {
 2     private String name;
 3     private int imageViewID;
 4    public Animal(String name,int imageViewID){
 5        this.name = name;
 6        this.imageViewID = imageViewID;
 7    }
 8 
 9     public String getName() {
10         return name;
11     }
12 
13     public int getImageViewID() {
14         return imageViewID;
15     }
16 }

　　（2）给自己的这个ListView定制一个布局，布局里包含TextView和ImageView。

　　这里会动态使用布局，只需要创建一个TextView和一个ImageView。

 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 2               android:orientation="vertical"
 3               android:layout_width="match_parent"
 4               android:layout_height="match_parent">
 5     <TextView
 6         android:id="@+id/tv_name"
 7         android:layout_width="wrap_content"
 8         android:layout_height="wrap_content"/>
 9     <ImageView
10         android:id="@+id/iv_animal"
11         android:layout_width="wrap_content"
12         android:layout_height="wrap_content"/>
13 
14 </LinearLayout>

　　（3）自己设计一个适配器

　　继承ArrayAdapter<Animal>，然后重写它的构造函数，构造函数参数有三个：context上下文、textViewResourceId布局id、objects 包含Animal对象的集合。

　　重写getView方法，在方法里定义一个Animal的变量，利用getItem(position)获取当前的Animal实例，然后用LayoutInflater.from(getContext()).inflate(animalId,parent,false)获取动态布局。

　　下一步利用id获取TextView和ImageView，分别给他们“赋值”，因为图片和文字是保存在Animal里面的，所以需要通过get方法给他们赋值，最后返回view。

 1 public class AnimalAdapter extends ArrayAdapter<Animal> {
 2     private int animalId;
 3     public AnimalAdapter(Context context,int textViewResourceId, List<Animal> objects) {
 4         super(context,  textViewResourceId, objects);
 5         animalId = textViewResourceId;
 6     }
 7 
 8     @Override
 9     public View getView(int position, View convertView, ViewGroup parent) {
10         Animal animal = getItem(position);
11         View view = LayoutInflater.from(getContext()).inflate(animalId,parent,false);
12         ImageView imageView = (ImageView) view.findViewById(R.id.iv_animal);
13         TextView textView = (TextView) view.findViewById(R.id.tv_name);
14         imageView.setImageResource(animal.getImageViewID());
15         textView.setText(animal.getName());
16         return view;
17     }
18 }

　　（4）在MainActivity里定义一个盛放Animal对象的集合。

　　　利用 initAnimal()给集合赋值，在函数里，用for循环，多创建几个实例，图片有限，全程用了一本书的图片。

　　　　然后用自己的适配器，传进参数。

　　　　利用id获取ListView，并把适配器设置进去。

 1 public class MainActivity extends AppCompatActivity {
 2     private List<Animal> animalList = new ArrayList<>();
 3     @Override
 4     protected void onCreate(Bundle savedInstanceState) {
 5         super.onCreate(savedInstanceState);
 6 
 7         setContentView(R.layout.activity_main);
 8          9         initAnimal();
10         AnimalAdapter animalAdapter = new AnimalAdapter(MainActivity.this,R.layout.animal_layout,animalList);
11         ListView listView = (ListView) findViewById(R.id.my_listView);
12         listView.setAdapter(animalAdapter);
13 
14 
15     }
16     void initAnimal(){
17         for (int i = 0; i <20 ; i++) {
18             Animal dog = new Animal("狗",R.drawable.book);
19             animalList.add(dog);
20             Animal cat = new Animal("猫",R.drawable.book);
21             animalList.add(cat);
22         }
23     }
24 }

　　（5）运行：

　　看到一本书《第一行代码：第二版》里面说这样ListView运行效率低，因为每次都会调用findViewById，然后从上面截了一张图：

　　发现真心不错：赞

　　转载与第一行代码

　　　　这里也可以设置点击事件：

 1 protected void onCreate(Bundle savedInstanceState) {
 2         super.onCreate(savedInstanceState);
 3 
 4         setContentView(R.layout.activity_main);
 5         Log.e("MainActivity","run.........");
 6         initAnimal();
 7         AnimalAdapter animalAdapter = new AnimalAdapter(MainActivity.this,R.layout.animal_layout,animalList);
 8         ListView listView = (ListView) findViewById(R.id.my_listView);
 9         listView.setAdapter(animalAdapter);
10         listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
11             @Override
12             public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
13                 Animal animal = animalList.get(position);
14                 Toast.makeText(MainActivity.this,animal.getName(),Toast.LENGTH_LONG).show();
15             }
16         });
17 
18 
19     }

猜你喜欢