由于某些原因,需要个错位的页面,在网上找不到好的例子,试着动手写了写。
不考虑配色的完成图如下:
images/loading.gif' data-original="http://images0.cnblogs.com/blog2015/772788/201508/101351267071108.jpg" width="273" height="485" />
首先考虑的是,listview每一行左右都有可能缩进。
先假设一行的布局就是ImageView,TextView,ImageView,代码如下:
1 <LinearLayout ="http://schemas.android.com/apk/res/android" 2 ="http://schemas.android.com/tools" 3 android:layout_width="match_parent" 4 android:layout_height="match_parent" 5 android:orientation="vertical"> 6 7 <RelativeLayout 8 android:id="@+id/rl_line" 9 android:layout_width="match_parent"10 android:layout_height="50dp">11 12 <ImageView 13 android:id="@+id/iv_left"14 android:layout_width="50dp"15 android:background="#cccccc"16 android:layout_height="match_parent"/>17 18 <ImageView19 android:id="@+id/iv_right"20 android:layout_width="50dp"21 android:background="#cccccc"22 android:layout_height="match_parent"23 android:layout_alignParentRight="true"/>24 25 <TextView 26 android:id="@+id/tv"27 android:layout_width="match_parent"28 android:layout_height="match_parent"29 android:layout_toRightOf="@id/iv_left"30 android:layout_toLeftOf="@id/iv_right"31 android:background="#ffffff"32 android:text="example"33 android:textSize="17sp"/>34 35 </RelativeLayout>36 37 </LinearLayout>
接下来要考虑,如何保证一行靠左,一行靠右呢?
可以通过判断行数,来选择ImageView是否显示,大致如下:
1 if(position % 2 == 0){2 holder.iv_left.setVisibility(View.GONE);3 holder.iv_right.setVisibility(View.VISIBLE);4 }5 else{6 holder.iv_left.setVisibility(View.VISIBLE);7 holder.iv_right.setVisibility(View.GONE);8 }
之所以还要设置Visibile,是因为第一项和最后一项因为某些原因,会不隐藏ImageView。
这处代码也可以精简。
完成的自定义Adapter如下:
1 public class ListviewAdapter extends BaseAdapter{ 2 private LayoutInflater inflater; 3 private ViewHolder holder; 4 private int index = 0; 5 private Context c; 6 private String string[]; 7 8 public ListviewAdapter(Context c,String[] string){ 9 super();10 this.c = c;11 this.string = string;12 inflater = LayoutInflater.from(c);13 }14 15 @Override16 public int getCount() {17 // TODO Auto-generated method stub18 return string.length;19 }20 21 @Override22 public Object getItem(int position) {23 // TODO Auto-generated method stub24 return null;25 }26 27 @Override28 public long getItemId(int position) {29 // TODO Auto-generated method stub30 return 0;31 }32 33 @Override34 public View getView(final int position, View convertView, ViewGroup parent) {35 // TODO Auto-generated method stub36 holder = new ViewHolder();37 if(convertView == null){38 convertView = inflater.inflate(R.layout.mylistview, null);39 holder.tv = (TextView)convertView.findViewById(R.id.tv);40 holder.iv_left = (ImageView)convertView.findViewById(R.id.iv_left);41 holder.iv_right = (ImageView)convertView.findViewById(R.id.iv_right);42 convertView.setTag(holder);43 }44 else45 holder = (ViewHolder) convertView.getTag();46 holder.tv.setText(string[position]);47 48 if(position % 2 == 0){49 holder.iv_left.setVisibility(View.GONE);50 holder.iv_right.setVisibility(View.VISIBLE);51 }52 else{53 holder.iv_left.setVisibility(View.VISIBLE);54 holder.iv_right.setVisibility(View.GONE);55 }56 return convertView;57 }58 59 public class ViewHolder{60 public TextView tv;61 public ImageView iv_left;62 public ImageView iv_right;63 }64 65 }
ListviewAdapter.java
由于两个ImageView设置了颜色为#cccccc,为了保证看起来像一体的,listview的间距和整个页面背景都要设置为#CCCCCC。
activity_main的代码如下:
1 <RelativeLayout ="http://schemas.android.com/apk/res/android" 2 ="http://schemas.android.com/tools" 3 android:layout_width="match_parent" 4 android:layout_height="match_parent" 5 android:background="#cccccc" 6 tools:context="com.example.listviewdemo.MainActivity" > 7 8 <ListView 9 android:id="@+id/lv"10 android:layout_width="match_parent"11 android:layout_height="match_parent"12 android:divider="#cccccc"13 android:dividerHeight="18dp"/>14 15 </RelativeLayout>
activity_main.
以及MainActivity:
1 public class MainActivity extends Activity { 2 private ListView lv; 3 private ListviewAdapter adapter; 4 private String[] list = new String[]{"aaa","bbb","ccc","ddd","eee", 5 "111","222","333","444","555"}; 6 7 @Override 8 protected void onCreate(Bundle savedInstanceState) { 9 super.onCreate(savedInstanceState);10 setContentView(R.layout.activity_main);11 lv = (ListView)findViewById(R.id.lv);12 adapter = new ListviewAdapter(this,list);13 lv.setAdapter(adapter);14 15 lv.setOnItemClickListener(new myOnItemClickListener());16 17 }18 19 private class myOnItemClickListener implements OnItemClickListener {20 @Override21 public void onItemClick(AdapterView<?> parent, View view, int position, long id) {22 Toast.makeText(getApplicationContext(), "您选择的是:" + list[position],23 Toast.LENGTH_SHORT).show();24 }25 }26 27 public void onBackPressed() {28 // TODO Auto-generated method stub29 super.onBackPressed();30 }31 32 }
MainActivity.java
因为只考虑了实现页面,没有考虑功能,故点击操作只有Toast提示。
如果有好的点子,大概会用这个样式写点什么吧
这样的布局好不好看,仁者见仁智者见智……
原标题:Android中ListView错位布局实现(无聊向)
关键词:Android