Android物流跟踪

标签：android   布局   时间轴   

最近在网上看到时间轴的布局效果，尝试按照这个原理，实现物流跟踪的效果，目前已经实现了，效果如下图。

界面布局主要是通过listView来实现的，listView item 左右布局。左边是竖线，状态图片，竖线。右边 是 物流信息和 时间。

开始左边线的高度很不好适配，最后请教网友，用了layout_weight属性。

竖线本来使用的是ImageView显示，结果线的高度变小，宽度也随之变小，导致屏幕根本看不清左边布局中状态图片上的线。

最后采用了View来绘制竖线，效果还挺理想的额。

具体的布局如下：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
       xmlns:android="http://schemas.android.com/apk/res/android"  
       android:layout_width="fill_parent"  
       android:layout_height="wrap_content"
       android:orientation="horizontal"
       >
      <LinearLayout 
       android:layout_width="wrap_content"  
       android:layout_height="fill_parent"
       android:layout_marginStart="10dip" 
       android:orientation="vertical"
       android:gravity="center"
       > 
        <View 
            android:id="@+id/View_logistic_tracking_line1"
            android:layout_width="2dip"
            android:layout_height="20dip"   
		    android:background="#DCDCDC"/>
		    <ImageView
            android:id="@+id/mgView_logistic_tracking_status"
            android:layout_width="wrap_content"  
	        android:layout_height="wrap_content" 
		    android:src="@drawable/logistics_state1"	    
		    android:contentDescription="@string/app_name"
	        />     
       <View 
            android:id="@+id/View_logistic_tracking_line2"
            android:layout_width="2dip"  
            android:layout_height="0dip"
            android:layout_weight="1"
		    android:background="#DCDCDC"/>
      </LinearLayout>
        <LinearLayout 
	       android:id="@+id/ll_logistic_tracking_timeline"
	       android:layout_width="fill_parent"  
	       android:layout_height="wrap_content"
	       android:layout_marginLeft="10dip"
	       android:layout_marginRight="10dip"
	       android:orientation="vertical"
       >
         <TextView 
            android:id="@+id/tv_logistic_tracking_address"
            android:layout_width="match_parent"  
	        android:layout_height="wrap_content" 
	        android:layout_marginTop="20dip"
	        android:textSize="20sp"
	        android:textColor="#000000"
	        />          
       <TextView  
            android:id="@+id/tv_logistic_tracking_time"  
	        android:layout_width="match_parent"   
	        android:layout_height="wrap_content"
	        android:layout_marginTop="10dip"
	        android:layout_marginBottom="20dip"
	        android:textSize="18sp"
	        android:textColor="#000000"
	        />
      </LinearLayout>
  </LinearLayout>

自定义的适配器：

public class TimeLineAdapter extends BaseAdapter {

	private Context mcontext=null;
    private List<TimeLine> mlist=null;
	private LayoutInflater minflater;
	
	public TimeLineAdapter ( Context context, List<TimeLine> list  ){
		this.mcontext = context;
		minflater = LayoutInflater.from(context);
		mlist = list;
	}
	@Override
	public int getCount() {
		// TODO Auto-generated method stub
		if( null!=mlist){
			return mlist.size();
		}
		return 0;
	}

	@Override
	public Object getItem(int position) {
		// TODO Auto-generated method stub
		if( null!=mlist){
			return mlist.get(position);
		 }
		return null;
	}

	@Override
	public long getItemId(int position) {
		// TODO Auto-generated method stub
		return position;
	}

	@SuppressLint("InflateParams")
	@Override
	public View getView(int position, View convertView, ViewGroup parent) {
		// TODO Auto-generated method stub	
		 ViewHold viewHold;
		if(convertView == null){
			viewHold = new ViewHold();
			convertView = minflater.inflate(R.layout.timeline_item, null);
			viewHold.imageView1 = (ImageView)convertView.findViewById(R.id.mgView_logistic_tracking_status);
			viewHold.textView1 = (TextView)convertView.findViewById(R.id.tv_logistic_tracking_address);
			viewHold.textView2 = (TextView)convertView.findViewById(R.id.tv_logistic_tracking_time);
			viewHold.line1 = (View)convertView.findViewById(R.id.View_logistic_tracking_line1);
			convertView.setTag(viewHold);
		}else {
			viewHold = (ViewHold)convertView.getTag( );
		}
		if(position==0){
			viewHold.line1.setVisibility(View.INVISIBLE);
			viewHold.imageView1.setImageResource(R.drawable.logistics_state);
		}else{
			viewHold.line1.setVisibility(View.VISIBLE);
			viewHold.imageView1.setImageResource(R.drawable.logistics_state1);
		}
		viewHold.textView1.setText( mlist.get(position).getMaddress());
		viewHold.textView2.setText( mlist.get(position).getMtime());
		return convertView;
	}
	

    private final static class ViewHold{
    	
        ImageView imageView1;
        View line1;
    	TextView  textView1;
    	TextView textView2;  	
    }
}

public class TimeLine {

	private String  maddress;
	private String  mtime;
	
	public TimeLine( String address ,String time){

		this.maddress = address;
		this.mtime = time;
	}


	public String getMaddress() {
		return maddress;
	}

	public void setMaddress(String maddress) {
		this.maddress = maddress;
	}

	public String getMtime() {
		return mtime;
	}

	public void setMtime(String mtime) {
		this.mtime = mtime;
	}
}

Android物流跟踪

标签：android   布局   时间轴   

原文地址：http://blog.csdn.net/nanxizhu/article/details/47664819