UI组件-AdapterView及其子类-低调大师

UI组件-AdapterView及其子类

2017-10-19 641

前言

只要自己变优秀了，其他的事情才会跟着好起来。

ListView组件

ListView是手机系统中使用非常广泛的一种组件，它以垂直列表的形式显示所有列表项。接下来介绍几种创建ListView的方法。

代码示例

使用数组创建ListView

listview.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" >
    <!-- 直接使用数组资源给出列表项 -->
    <!-- 设置使用红色的分隔条 -->
    <ListView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:entries="@array/books"
        android:divider="#f00"
        android:dividerHeight="2px"
        />
</LinearLayout>

arrays.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string-array name="books">
        <item>西游记</item>
        <item>水浒传</item>
        <item>三国演义</item>
        <item>红楼梦</item>
    </string-array>
</resources>

使用ArrayAdapter创建ListView

listview2.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" >
    <!-- 设置红色分隔条 -->
    <ListView
        android:id="@+id/list1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:divider="#f00"
        android:dividerHeight="2px"
        />
    <!-- 设置绿色分隔条 -->
    <ListView
        android:id="@+id/list2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:divider="#0f0"
        android:dividerHeight="2px"
        />
</LinearLayout>

array_item.xml

<?xml version="1.0" encoding="utf-8"?>
<TextView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/textView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:textSize="24dp"
    android:padding="10px"
    android:shadowColor="#f0f"
    android:shadowDx="4"
    android:shadowDy="4"
    android:shadowRadius="2"/>

MainActivity.java

public class MainActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.listview2);

        ListView list1 = (ListView) findViewById(R.id.list1);
        //定义一个数组
        String []books = new String[] {"三国演义","红楼梦","西游记","水浒传"};
        //将数组包装为ArrayAdapter
        ArrayAdapter<String> adapter1 = new ArrayAdapter<String>(this, R.layout.array_item, books);
        //为ListView设置Adapter
        list1.setAdapter(adapter1);

        ListView list2 = (ListView) findViewById(R.id.list2);
        //定义一个数组
        String []names = new String[] {"孙悟空","猪八戒","沙和尚","唐僧"};
        //将数组包装为ArrayAdapter
        ArrayAdapter<String> adapter2 = new ArrayAdapter<String>(this, R.layout.array_item, names);
        //为ListView设置Adapter
        list2.setAdapter(adapter2);
    }
}

使用SimpleAdapter创建ListView

listview3.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="horizontal" >

    <!-- 定义一个ListView -->
    <ListView
        android:id="@+id/mylist"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        />
</LinearLayout>

simple_item.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="wrap_content"
    android:orientation="horizontal" >
    <!-- 定义一个ImageView，作为列表项的一部分 -->
    <ImageView
        android:id="@+id/header"
        android:scaleType="fitXY"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:paddingLeft="10dp"
        />
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        >
        <!-- 定义一个TextView，作为列表项的一部分 -->
        <TextView
            android:id="@+id/name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="20dp"
            android:textColor="#f0f"
            android:paddingLeft="10dp"
            />
         <!-- 定义一个TextView，作为列表项的一部分 -->
         <TextView
            android:id="@+id/desc"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="14dp"
            android:paddingLeft="10dp"
            />
    </LinearLayout>
</LinearLayout>

MainActivity.java

public class MainActivity extends Activity {

    private String[] names = new String[]
            {"考拉","郁金香","企鹅","水母"};

    private String[] descs = new String[]
            {"一种可爱的动物","一种美丽的花朵","一种生活在南极的动物","一种生活在海里的神奇生物"};
    private int[] imageIds = new int[]
            {R.drawable.kaola,R.drawable.yujinx,R.drawable.qie,R.drawable.shuimo};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.listview3);
        //创建一个List集合，List集合的元素是Map
        List<Map<String,Object>> listItems = new ArrayList<Map<String,Object>>();
        for(int i = 0; i < names.length; i++)
        {
            Map<String, Object> listItem = new HashMap<String, Object>();
            listItem.put("header", imageIds[i]);
            listItem.put("name", names[i]);
            listItem.put("desc", descs[i]);
            listItems.add(listItem);
        }
        //创建一个SimpleAdapter
        SimpleAdapter simpleAdapter = new SimpleAdapter(this, listItems, R.layout.simple_item,
                new String[] {"name","header","desc"},
                new int[] {R.id.name,R.id.header,R.id.desc});

        ListView list = (ListView) findViewById(R.id.mylist);
        //为ListView设置Adapter
        list.setAdapter(simpleAdapter);
    }
}

使用BaseAdapter创建ListView

listview4.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" >
    <ListView
        android:id="@+id/myList"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />
</LinearLayout>

MainActivity.java

public class MainActivity extends Activity {
    ListView myList;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.listview4);

        myList = (ListView) findViewById(R.id.myList);
        BaseAdapter adapter = new BaseAdapter() {

            //重写该方法，该方法返回的View将作为列表框
            @Override
            public View getView(int position, View convertView, ViewGroup parent) {
                //创建一个LinearLayout，并向其中添加两个组件
                LinearLayout line = new LinearLayout(MainActivity.this);
                line.setOrientation(0);
                ImageView image = new ImageView(MainActivity.this);
                image.setImageResource(R.drawable.ic_launcher);
                TextView text = new TextView(MainActivity.this);
                text.setText("第" + (position + 1) + "个列表项");
                text.setTextSize(20);
                text.setTextColor(Color.RED);
                line.addView(image);
                line.addView(text);
                return line;
            }

            @Override
            public long getItemId(int position) {
                return position;
            }

            @Override
            public Object getItem(int position) {
                return null;
            }

            @Override
            public int getCount() {
                //指定一共包含40个列表项
                return 40;
            }
        };
        myList.setAdapter(adapter);
    }
}

基于ListActivity实现列表

listactivity.xml

<?xml version="1.0" encoding="utf-8"?>
<TextView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/tv"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    />

MainActivity.java

public class MainActivity extends ListActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //无需使用布局文件
        String[] names = {"西游记","红楼梦","三国演义","水浒传"};
        //创建ArrayAdapter对象
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, R.layout.listactivity, names);
        //设置该窗口显示列表
        setListAdapter(adapter);
    }
}

效果

使用数组创建的ListView

Screenshot_1508382099.png

使用ArrayAdapter创建的ListView

Screenshot_1508383040.png

使用SimpleAdapter创建的ListView

Screenshot_1508388930.png

使用BaseAdapter创建的ListView

Screenshot_1508389647.png

基于ListActivity实现的列表

Screenshot_1508390424.png

提示

当列表项很多时，为了防止内存溢出，可以使用ListView的andriod:scrollingCache属性来绘制缓冲，同时还有别的方法。以后将会介绍。

下面我来说说上述几个Adapter的区别。

ArrayAdapter:简单、易用的Adapter，通常用于将数组或List集合的多个值包装成多个列表项。
SimpleAdapter:并不简单、功能强大的Adapter，可用于将List集合的多个对象包装成多个列表项。
BaseAdapter:通常用于被扩展。扩展BaseAdapter可以对各列表项进行最大限度的定制。我比较喜欢用这个Adapter，使用这个Adapter需要重写如下四个方法。
1. getCount():该方法的返回值控制该Adapter将会包含多少个列表项。
2. getItem(int position):该方法的返回值决定第position处的列表项的内容。
3. getItemId(int position):该方法的返回值决定第position处的列表项的ID。
4. getView(int position,View convertView,ViewGroup parent):该方法的返回值决定第position处的列表项组件。

其中最重要的第1个和第4个方法。

AutoCompleteTextView组件

自动完成文本框(AutoCompeletTextView)从EditText派生而出，实际上它也是一个文本编辑框，但它比普通编辑框多了一个功能:当用户输入一定的字符之后，自动完成文本框会显示一个下拉菜单，供用户选择，当用户选择某个菜单项之后，AutoCompleteTextView按用户选择自动填写该文本框。

代码示例

autocompletetextview.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" >
    <!-- 定义一个自动完成文本框，指定输入一个字符后进行提示 -->
    <AutoCompleteTextView
        android:id="@+id/auto"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:completionHint="请选择您喜欢的图书"
        android:completionThreshold="1"
        />
    <!-- 定义一个MultiAutoCompleteTextView组件 -->
    <MultiAutoCompleteTextView
        android:id="@+id/mauto"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:completionThreshold="1"
        />
</LinearLayout>

MainActivity.java

public class MainActivity extends Activity {
    AutoCompleteTextView actv;
    MultiAutoCompleteTextView mauto;
    //定义字符串数组，作为提示文本
    String[] books = new String[] {
            "西游记",
            "水浒传",
            "三国演义",
            "水浒传"
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.autocompletetextview);
        //创建一个ArrayAdapter，封装数组
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_dropdown_item_1line, books);
        actv = (AutoCompleteTextView) findViewById(R.id.auto);
        //设置Adapter
        actv.setAdapter(adapter);
        mauto = (MultiAutoCompleteTextView) findViewById(R.id.mauto);
        //设置Adapter
        mauto.setAdapter(adapter);
        //为MultiAutoCompleteTextView设置分隔符
        mauto.setTokenizer(new MultiAutoCompleteTextView.CommaTokenizer());
    }
}

效果

Screenshot_1508393517.png

提示

AutoCompleteTextView与MultiAutoCompleteTextView的区别在于MultiAutoCompleteTextView允许输入多个提示项，多个提示项以分隔符分隔。

android:comletionThreshold属性，设置用户至少输入几个字符才会显示提示。

GridView组件

网格视图(GridView)和ListView有共同的父类，它们的唯一区别在于ListView只显示一列，而GridView可以显示多列。另外，ListView相当于一种特殊的GridView，如果GridView只显示一列，那么该GridView就变成了ListView。

与ListView类似的是，GridView也需要Adapter来提供显示的诗数据，可以通过ArrayAdapter、SimpleAdapter、BaseAdapter来创建Adapter，用法基本一致。

代码示例

gridview.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"
    android:gravity="center_horizontal"
    >
    <!-- 定义一个GridView组件 -->
    <GridView
        android:id="@+id/grid01"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:horizontalSpacing="1pt"
        android:verticalSpacing="1pt"
        android:numColumns="4"
        android:gravity="center"
        />
    <!-- 定义一个ImageView -->
    <ImageView
        android:id="@+id/imageView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="2dp"
        android:layout_gravity="center_horizontal"
        />
</LinearLayout>

cell.xml

<?xml version="1.0" encoding="utf-8"?>
<ImageView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/image1"
    android:layout_width="70dp"
    android:layout_height="70dp"
    />

MainActivity.java

public class MainActivity extends Activity {

    GridView grid;
    ImageView imageView;
    int[] imageIds = new int[]
            {
                R.drawable.baxianhua,R.drawable.dengta,R.drawable.ic_launcher,R.drawable.juhua,
                R.drawable.kaola,R.drawable.shamo,R.drawable.shuimo,R.drawable.yujinx,
                R.drawable.qie,R.drawable.shamo,R.drawable.shuimo,R.drawable.yujinx,
                R.drawable.baxianhua,R.drawable.dengta,R.drawable.ic_launcher,R.drawable.juhua
            };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.gridview);

        //创建一个List对象，List对象的元素是Map
        List<Map<String,Object>> listItems = new ArrayList<Map<String,Object>>();
        for (int i = 0; i < imageIds.length; i++) {
            Map<String,Object> listItem = new HashMap<String, Object>();
            listItem.put("image", imageIds[i]);
            listItems.add(listItem);
        }
        //获取显示图片的ImageView
        imageView = (ImageView) findViewById(R.id.imageView);
        //创建一个SimpleAdapter
        SimpleAdapter simpleAdapter = new SimpleAdapter(this, listItems, R.layout.cell,
                new String[] {"image"}, new int[] {R.id.image1});
        grid = (GridView) findViewById(R.id.grid01);
        //为GridView设置Adapter
        grid.setAdapter(simpleAdapter);
        //添加列表项被选中的监听器
        grid.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {

            @Override
            public void onNothingSelected(AdapterView<?> parent) {
            }

            @Override
            public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
                //显示当前被选中的图片
                imageView.setImageResource(imageIds[position]);
            }
        });

        //添加列表项被单击的监听器
        grid.setOnItemClickListener(new AdapterView.OnItemClickListener() {

            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                //显示背单击的图片
                imageView.setImageResource(imageIds[position]);
            }
        });
    }
}

效果

Screenshot_1508398206.png

提示

android:numColumns属性，设置列数。

android:horizontalSpacing属性，设置个元素之间的水平间距。

android:verticalSpacing属性，设置个元素之间的垂直间距。

ExpandableListView组件

可展开的列表组件(ExpandableListView)是ListView的子类，它在普通ListView的基础上进行了扩展，它把应用中的列表项分为几组，每组里又可包含多个列表项。

ExpandableListView所显示的列表项由ExpandableListAdapter提供。实现ExpandableListAdapter的方式有如下三种。

扩展BaseExpandableListAdapter实现ExpandableListAdapter。
使用SimpleExpandableListAdapter将两个List集合包装成ExpandableListAdapter。
使用SimpleCursorTreeAdapter将Cursor中的数据包装成SimpleCursorTreeAdapter。

代码示例

expandablelistview.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" >
    <ExpandableListView
        android:id="@+id/list"
        android:childDivider="#f00"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        />
</LinearLayout>

MainActivity.java

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.expandablelistview);
        //创建一个ExpandableListAdapter对象
        ExpandableListAdapter adapter = new BaseExpandableListAdapter() {

            int[] logos = new int[]
            {
                R.drawable.kaola,
                R.drawable.qie,
                R.drawable.shuimo
            };

            private String[] armTypes = new String[]
            {"考拉","企鹅","水母"};
            private String[][] arms = new String[][]
            {
                {"白考拉","红考拉","黑考拉"},
                {"白企鹅","帝企鹅","黑企鹅"},
                {"白水母","毒水母","黑水母"}
            };

            @Override
            public boolean isChildSelectable(int groupPosition, int childPosition) {
                return true;
            }

            @Override
            public boolean hasStableIds() {
                return true;
            }

            //该方法决定每个组选项的外观
            @Override
            public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {
                LinearLayout ll = new LinearLayout(MainActivity.this);
                ll.setOrientation(0);
                ImageView logo = new ImageView(MainActivity.this);
                logo.setImageResource(logos[groupPosition]);
                logo.setLayoutParams(new LinearLayout.LayoutParams(100, 100));
                ll.addView(logo);
                TextView textView = new TextView(MainActivity.this);
                textView.setText(getGroup(groupPosition).toString());
                textView.setTextSize(20);
                ll.addView(textView);
                return ll;
            }

            @Override
            public long getGroupId(int groupPosition) {
                return groupPosition;
            }

            @Override
            public int getGroupCount() {
                return armTypes.length;
            }

            //获取指定组位置处的组数据
            @Override
            public Object getGroup(int groupPosition) {
                return armTypes[groupPosition];
            }

            @Override
            public int getChildrenCount(int groupPosition) {
                return arms[groupPosition].length;
            }

            private TextView geTextView()
            {
                AbsListView.LayoutParams lp = new AbsListView.LayoutParams(
                        ViewGroup.LayoutParams.MATCH_PARENT,64);
                TextView textView = new TextView(MainActivity.this);
                textView.setLayoutParams(lp);
                textView.setGravity(Gravity.CENTER_VERTICAL | Gravity.LEFT);
                textView.setPadding(36, 0, 0, 0);
                textView.setTextSize(20);
                return textView;
            }
            //该方法决定每个子选项的外观
            @Override
            public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView,
                    ViewGroup parent) {
                TextView textView = geTextView();
                textView.setText(getChild(groupPosition, childPosition).toString());
                return textView;
            }

            @Override
            public long getChildId(int groupPosition, int childPosition) {
                return childPosition;
            }

            //获取指定组位置、指定子列表项处的子列表项数据
            @Override
            public Object getChild(int groupPosition, int childPosition) {
                return arms[groupPosition][childPosition];
            }
        };
        ExpandableListView expandListView = (ExpandableListView) findViewById(R.id.list);
        expandListView.setAdapter(adapter);
    }
}

效果

Screenshot_20171020-093318.png

提示

上面使用BaseExpandableListAdapter来实现ExpandableListAdapter，当扩展BaseExpandableListAdapter时，关键是实现如下4个方法。

getGroupCount():该方法返回包含的组列表项的数量。
getGroupView():该方法返回的View对象将作为组列表项。
getChildrenCount():该方法返回特定组所包含的子列表项的数量。
getChildView():该方法返回的View对象将作为特定组，特定位置的子列表项。

Spinner组件

Spinner其实就是一个列表选择框，不过不是显示下拉列表，而是弹出一个菜单供用户选择。如果已经确定了Spinner的列表项，只要为Spinner指定android:entries属性即可；如果不确定列表项，需要在程序运行时动态决定Spinner的列表项，则需要用Adapter来为Spinner提供列表项。

代码示例

spinner.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" >
    <!-- 定义一个Spinner组件,指定显示该Spinner组件的数组 -->
    <Spinner
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:entries="@array/books"
        />
    <Spinner
        android:id="@+id/spinner"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        />
</LinearLayout>

MainActivity.java

public class MainActivity extends Activity {
    Spinner spinner;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.spinner);
        //获取界面布局文件中的Spinner
        spinner = (Spinner) findViewById(R.id.spinner);
        String []arr = {"西游记","红楼梦","三国演义","水浒传"};
        //创建ArrayAdapter对象
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
                android.R.layout.simple_list_item_multiple_choice,arr);
        //为Spinner设置Adapter
        spinner.setAdapter(adapter);
    }
}

效果

Screenshot_20171020-100344.png

提示

第一个Spinner组件指定了android:entries属性，第二个Spinner组件没有指定android:entries属性，因此需要在Activity中为它设置Adapter。

AdapterViewFlipper组件

AdapterViewFlipper继承了AdapterViewAnimator，它也会显示Adapter提供的多个View组件，但它每次只能显示一个View组件，程序可通过showPrevious()和showNext()方法控制该组件显示上一个、下一个组件。它还有自动播放的功能。

代码示例

adapterviewanimator.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <AdapterViewFlipper
        android:id="@+id/flipper"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:flipInterval="5000"
        android:layout_alignParentTop="true"
        />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentBottom="true"
        android:onClick="prev"
        android:text="上一个"
        />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:onClick="next"
        android:text="下一个"
        />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentBottom="true"
        android:onClick="auto"
        android:text="自动播放"
        />
</RelativeLayout>

MainAvtivity.java

public class MainActivity extends Activity {

    int[] imageIds = new int[]
    {
        R.drawable.baxianhua,R.drawable.dengta,R.drawable.juhua,
        R.drawable.kaola,R.drawable.qie,R.drawable.shamo,R.drawable.shuimo,
        R.drawable.yujinx
    };
    private AdapterViewFlipper flipper;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.adapterviewanimator);
        flipper = (AdapterViewFlipper) findViewById(R.id.flipper);
        //创建一个BaseAdapter对象
        BaseAdapter adapter = new BaseAdapter() {

            @Override
            public View getView(int position, View convertView, ViewGroup parent) {

                //创建一个ImageView
                ImageView imageView = new ImageView(MainActivity.this);
                imageView.setImageResource(imageIds[position]);
                //设置ImageView的缩放类型
                imageView.setScaleType(ScaleType.FIT_XY);
                //为ImageView设置布局参数
                imageView.setLayoutParams(new ViewGroup.LayoutParams(
                        LayoutParams.MATCH_PARENT,LayoutParams.MATCH_PARENT
                        ));
                return imageView;
            }

            @Override
            public long getItemId(int position) {
                return position;
            }

            @Override
            public Object getItem(int position) {
                return imageIds[position];
            }

            @Override
            public int getCount() {
                return imageIds.length;
            }
        };
        flipper.setAdapter(adapter);
    }

    public void prev(View view) {
        //显示上一个组件
        flipper.showPrevious();
        //停止自动播放
        flipper.stopFlipping();
    }

    public void next(View view) {
        //显示上一个组件
        flipper.showNext();
        //停止自动播放
        flipper.stopFlipping();
    }

    public void auto(View view) {
        //开始自动播放
        flipper.startFlipping();
    }
}

效果

Screenshot_20171020-103243.png

提示

android:animateFirstView属性，设置显示该组件的第一个View时是否使用动画。

android:inAnimation属性，设置组件显示时使用的动画。

android:loopViews属性，设置循环播放。

android:autoStart属性，设置是否自动播放。

android:flipInterval属性，设置自动播放的时间间隔。

StackView组件

StackView也是AdapterViewAnimator的子类，它用于显示Adapter提供的一系列View。StackView将会以“堆叠”的方式来显示多个列表项。

代码示例

stackview.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="horizontal" >
    <StackView
        android:id="@+id/stackview"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:loopViews="true"
        />
    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        >
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="上一个"
            android:onClick="prev"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="下一个"
            android:onClick="next"
            />
    </LinearLayout>
</LinearLayout>

MainActivity.java

public class MainActivity extends Activity {

    private StackView stackView;

    int[] imageIds = new int[]
    {
        R.drawable.baxianhua,R.drawable.dengta,R.drawable.juhua,
        R.drawable.kaola,R.drawable.qie,R.drawable.shamo,R.drawable.shuimo,
        R.drawable.yujinx
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.stackview);
        stackView = (StackView) findViewById(R.id.stackview);
        //创建一个List对象，List对象的元素是Map
        List<Map<String,Object>> listItems = new ArrayList<Map<String,Object>>();
        for (int i = 0; i < imageIds.length; i++) {
            Map<String, Object> listItem = new HashMap<String, Object>();
            listItem.put("image", imageIds[i]);
            listItems.add(listItem);
        }
        //创建一个SimpleAdapter
        SimpleAdapter simpleAdapter = new SimpleAdapter(this,
                listItems, R.layout.cell, new String[] {"image"}, new int[] {R.id.image1});

        stackView.setAdapter(simpleAdapter);
    }

    public void prev(View view) {
        //显示上一个组件
        stackView.showPrevious();
    }
    public void next(View view) {
        //显示下一个组件
        stackView.showNext();
    }
}

效果

Screenshot_20171020-110029.png

微信关注我们

原文链接：https://yq.aliyun.com/articles/637573

转载内容版权归作者及来源网站所有！

低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。

【前端优化之渲染优化】大屏android手机动画丢帧的背后

前言上周我与阿里的宇果有一次技术的交流，然后对天猫H5站点做了一些浅层次的分析，后面点时间基本天天都会有联系，中途聊了一些技术细节、聊了双方团队在干什么，最后聊到了前端优化。因为我本身参与了几次携程H5站点的优化，在这方面有一些心得，但是与宇果交流的过程中发现我们在优化的时候忽略了一些细节。携程做优化的时候整个重心基本放到了尺寸的缩减，和宇果的交流过程中他提出了渲染优化，其实渲染优化无非是减少回流，对于减少回流我们也有一些概念，我一直认为这个事情应该业务开发关注而不是框架关注（事实上框架也无法关注），所以对一些BUG采取了表现层面的解决，却对真相视而不见的做法，现在想来真的有点无知，这里便以一个原来的渲染BUG为切入点，将最近与宇果的交流所得整理下。宇果博客：http://www.ghugo.com/ 回流与重绘首先，我们再次复习一下回流与重绘的知识，浏览器会解析三个东西：HTML、Javascript、CSS。浏览器首先会根据HTML生成DOM Tree，其次会根据CSS生成CSS Rule Tree，javascript可以通过DOM API与CSS API操作DOM T...

2017-10-20

544

前言余生希望你和让你快乐的那个人度过。 ProgressBar组件进度条也是UI界面中一种常用的组件，Android支持多种风格的进度条，通过style属性可以为ProgressBar指定风格。该属性支持如下几个属性值。 @android:style/Widget.ProgressBar.Horizontal:水平进度条 "@android:style/Widget.ProgressBar.Inverse:普通大小的环形进度条 "@android:style/Widget.ProgressBar.Large:大环形进度条 "@android:style/Widget.ProgressBar.Large.Inverse:大环形进度条 "@android:style/Widget.ProgressBar.Small:小环形进度条 "@android:style/Widget.ProgressBar.Small.Inverse:小环形进度条代码示例 progress.xml <LinearLayout xmlns:android="http://schemas.android.c...

2017-10-20

493

资源下载

更多资源

优质分享App

近一个月的开发和优化，本站点的第一个app全新上线。该app采用极致压缩，本体才4.36MB。系统里面做了大量数据访问、缓存优化。方便用户在手机上查看文章。后续会推出HarmonyOS的适配版本。

Mario

马里奥是站在游戏界顶峰的超人气多面角色。马里奥靠吃蘑菇成长，特征是大鼻子、头戴帽子、身穿背带裤，还留着胡子。与他的双胞胎兄弟路易基一起，长年担任任天堂的招牌角色。

Nacos

Nacos /nɑ:kəʊs/ 是 Dynamic Naming and Configuration Service 的首字母简称，一个易于构建 AI Agent 应用的动态服务发现、配置管理和AI智能体管理平台。Nacos 致力于帮助您发现、配置和管理微服务及AI智能体应用。Nacos 提供了一组简单易用的特性集，帮助您快速实现动态服务发现、服务配置、服务元数据、流量管理。Nacos 帮助您更敏捷和容易地构建、交付和管理微服务平台。

Sublime Text

Sublime Text具有漂亮的用户界面和强大的功能，例如代码缩略图，Python的插件，代码段等。还可自定义键绑定，菜单和工具栏。Sublime Text 的主要功能包括：拼写检查，书签，完整的 Python API ， Goto 功能，即时项目切换，多选择，多窗口等等。Sublime Text 是一个跨平台的编辑器，同时支持Windows、Linux、Mac OS X等操作系统。