How to Make Android UI design more efficient

 

This article is an article by a developer who has participated in the Google I/o Conference in that adapted a PPT with a good topic on mobile apps. It is very helpful for mobile app developers.

Android UI optimization can begin with the following five aspects:

◆ Adapter Optimization

◆ Background and image Optimization

◆ Drawing Optimization

◆ View and Layout Optimization

◆ Memory allocation optimization

Adapter Optimization

What is Adapter?

Adapter plays an important role in Android. It is an important bond between data and UI (View. Adapter is required in common View (ListView, GridView) and other places. 1 intuitively expresses the relationship among Data, Adapter, and View.

Figure 1 Relationship Among Adapter, data, and UI

I. Adapter in Android

Figure 2: Adapter type hierarchy in Android

In Figure 2, we can see the complete hierarchy of all interfaces and classes related to Adapter in Android. During use, we can implement certain extensions of interfaces or inheritance classes according to our own needs. Commonly used include BaseAdapter, ArrayAdapter, and SimpleCursorAdapter.

BaseAdapter is an abstract class that inherits from it and requires many methods, so it has high flexibility;

ArrayAdapter supports generic operations. Generally, You need to implement the getView method. In special cases (combined with the data row id), it is best to override getItemId to make it easier to handle ui events;

SimpleCursorAdapter can be used for simple text-only ListView. It requires the Cursor field to correspond to the UI id. You can rewrite other methods to implement a more complex UI.

2. A code segment that inherits the BaseAdapter class

1. 1 :/**
2. 2: * song list Adapter
3. 3 :*
4. 4: * @ version 05:13:33
5. 5: * @ author Hal
6. 6 :*/
7. 7: public class AudioListAdapter extends BaseAdapter {
8. 8:
9. 9: private Context mContext;
10. 10:
11. 11: // song set
12. 12: private ArrayList <Audio> mAudios;
13. 13:
14. 14: public AudioListAdapter (Context mContext, ArrayList <Audio> mAudios ){
15. 15: this. mContext = mContext;
16. 16: this. mAudios = mAudios;
17. 17 :}
18. 18:
19. 19: @ Override
20. 20: public int getCount (){
21. 21: return mAudios! = Null? MAudios. size (): 0;
22. 22 :}
23. 23:
24. 24: @ Override
25. 25: public Object getItem (int position ){
26. 26: if (mAudios! = Null & mAudios. size ()> 0) & (position> = 0 & position <mAudios. size ())){
27. 27: return mAudios. get (position );
28. 28 :}
29. 29: return null;
30. 30 :}
31. 31:
32. 32 :/**
33. 33: * if the object data in the set comes from the database, it is recommended that this method return the ID of the object in the database.
34. 34 :*/
35. 35: @ Override
36. 36: public long getItemId (int position ){
37. 37: if (mAudios! = Null & mAudios. size ()> 0) & (position> = 0 & position <mAudios. size ())){
38. 38: return mAudios. get (position). getId ();
39. 39 :}
40. 40: return position;
41. 41 :}
42. 42:
43. 43: @ Override
44. 44: public View getView (int position, View convertView, ViewGroup parent ){
45. 45: // TODO returns the custom View
46. 46 :}

The connection between the Adapter and the View mainly relies on the getView method to return the custom view we need. ListView is one of the most commonly used controls in Android apps. Therefore, it is very important to get a good user experience to make ListView run smoothly. Optimizing ListView is to optimize the getView method in the Adapter. The optimization suggestions provided by the Google IO conference in are as follows:

Sample Code for Adapter optimization:

   1. @Override  
   2. public View getView(int position, View convertView, ViewGroup parent) {  
   3.     Log.d("MyAdapter", "Position:" + position + "---"  
   4.             + String.valueOf(System.currentTimeMillis()));  
   5.     ViewHolder holder;  
   6.      if (convertView == null) {  
   7.         final LayoutInflater inflater = (LayoutInflater) mContext  
   8.                 .getSystemService(Context.LAYOUT_INFLATER_SERVICE);  
   9.         convertView = inflater.inflate(R.layout.list_item_icon_text, ull);  
  10.         holder = new ViewHolder();  
  11.         holder.icon = (ImageView) convertView.findViewById(R.id.icon);  
  12.         holder.text = (TextView) convertView.findViewById(R.id.text);  
  13.         convertView.setTag(holder);  
  14.     } else {  
  15.         holder = (ViewHolder) convertView.getTag();  
  16.     }  
  17.     holder.icon.setImageResource(R.drawable.icon);  
  18.     holder.text.setText(mData[position]);  
  19.     return convertView;  
  20. }  
  21.    
  22. static class ViewHolder {  
  23.     ImageView icon;  
  24.    
  25.     TextView text;  

The above are the optimization suggestions provided at the Google I/O conference. After trying, The ListView is indeed a lot smoother.

   1. @Override  
   2. public View getView(int position, View convertView, ViewGroup parent) {  
   3.      Log.d("MyAdapter", "Position:" + position + "---"  
   4.              + String.valueOf(System.currentTimeMillis()));  
   5.          final LayoutInflater inflater = (LayoutInflater) mContext  
   6.                  .getSystemService(Context.LAYOUT_INFLATER_SERVICE);  
   7.         View v = inflater.inflate(R.layout.list_item_icon_text, null);  
   8.          ((ImageView) v.findViewById(R.id.icon)).setImageResource(R.drawable.icon);  
   9.          ((TextView) v.findViewById(R.id.text)).setText(mData[position]);  
  10.         return v;  
  11.  }  

The above is not recommended practice !!

But we still need to doubt it. SO, let's test and compare it.

Test Description:

You can see that the position and current system time are printed by log during getView. We initialize 1000 pieces of data to display on the Adapter to the ListView, scroll to the bottom, and calculate the time interval between position = 0 and position = 999.

Test HOST: HTC Magic

Test Recording: Enable sequencing to keep ListView rolling at the bottom.

Test results:

In both cases, the experience is significantly different during the operation process, and the optimization is much smoother!

1. Test results of optimization suggestions

1. 12-05 10:44:46. 039: DEBUG/MyAdapter (13929): Position: 0---1291517086043
2. 12-05 10:44:46. 069: DEBUG/MyAdapter (13929): Position: 1---1291517086072
3. 12-05 10:44:46. 079: DEBUG/MyAdapter (13929): Position: 2---1291517086085
4.
5 .......
6.
7. 12-05 10:45:04. 109: DEBUG/MyAdapter (13929): Position: 997---1291517104112
8. 12-05 10:45:04. 129: DEBUG/MyAdapter (13929): Position: 998---1291517213135
9. 12-05 10:45:04. 149: DEBUG/MyAdapter (13929): Position: 999---1291517103854
10.
11. Time consumed: 17967
12.

2. Test results not optimized

1. 12-05 10:51:42. 569: DEBUG/MyAdapter (14131): Position: 0---1291517502573
2. 12-05 10:51:42. 589: DEBUG/MyAdapter (14131): Position: 1---1291517502590
3. 12-05 10:51:42. 609: DEBUG/MyAdapter (14131): Position: 2---1291517502617
4.
5 .......
6.
7. 12-05 10:52:07. 079: DEBUG/MyAdapter (14131): Position: 998---1291517527082
8. 12-05 10:52:07. 099: DEBUG/MyAdapter (14131): Position: 999---1291517527108
9.
10. Time consumed: 24535
11.

There is such a gap in the case of 1000 records. Once the data nW + and the ListView Item layout are more complex, the optimization function becomes more prominent!

How to Make Android UI design more efficient _ Knowledge Base _ blog