仿知乎日报第十四篇：为CommentActivity加载布局

一.首先来看看效果：

整个就是一个LinearLayout，上面是RelativeLayout，里面是一个ImageButton，一个TextView，下面是一个ListView。长评标题和短评标题都是TextView，它们是ListView的头布局和尾布局，可以在代码中动态添加。

布局代码：（comment_page.xml）

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
     <RelativeLayout
       android:layout_width="match_parent"
       android:layout_height="60dp"
       android:background="#3CB371"
       android:gravity="center_vertical">
 
       
        <ImageButton
           android:id="@+id/ib_comment_back"
           android:layout_width="wrap_content"
           android:layout_height="match_parent"
           android:background="@android:color/transparent"
           android:paddingLeft="15dp"
           android:src="@drawable/abc_ic_ab_back_mtrl_am_alpha"/>
 
        <TextView
           android:id="@+id/tv_comment_title"
           android:layout_width="wrap_content"
           android:layout_height="match_parent"
           android:layout_marginLeft="20dp"
           android:layout_toRightOf="@id/ib_comment_back"
           android:gravity="center"
           android:textColor="#FFFFFF"
           android:textSize="18sp"/>
     
     
    </RelativeLayout>
   
       <ListView android:layout_width="match_parent"
           
           android:layout_height="match_parent"
           android:id="@+id/lv_comment_content"
           android:cacheColorHint="@android:color/transparent"
           android:listSelector="#00FFFFFF"></ListView>
    
 
</LinearLayout>

2.上面说到有一个ListView，我们也顺便看看ListView的item的布局

先看效果：

代码：（comment_list_item.xml）

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
 
    <ImageView
       android:id="@+id/iv_comment_item_pic"
       android:layout_width="45dp"
       android:layout_height="45dp"
       android:layout_margin="10dp"
       android:scaleType="center"
       android:src="@drawable/comment_default" />
 
    <TextView
       android:id="@+id/tv_comment_item_name"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_alignParentTop="true"
       android:layout_centerVertical="true"
       android:layout_marginBottom="10dp"
       android:layout_marginTop="10dp"
       android:layout_toRightOf="@id/iv_comment_item_pic"
       android:textSize="18sp"
       android:textStyle="bold"/>
 
    <TextView
       android:id="@+id/tv_comment_item_vote"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_alignParentRight="true"
       android:layout_alignTop="@id/tv_comment_item_name"
       android:layout_centerVertical="true"
       android:layout_marginRight="20dp"
       android:drawableLeft="@drawable/comment_vote"
       android:drawablePadding="5dp"
       android:text="3" />
 
    <TextView
       android:id="@+id/tv_comment_item_content"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:layout_alignLeft="@id/tv_comment_item_name"
       android:layout_below="@id/tv_comment_item_name"
        android:layout_marginRight="20dp"/>
 
    <TextView
       android:id="@+id/tv_comment_item_time"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_alignLeft="@id/tv_comment_item_content"
       android:layout_below="@id/tv_comment_item_content"
       android:layout_marginBottom="15dp"
       android:layout_marginTop="15dp"
       android:textColor="#DCDCDC"/>
 
</RelativeLayout>

 

二.接下去我们要在代码中加载布局了

public class CommentActivity extends Activity {
    private ImageButton  mIbBack;
    private TextView  mTvTitle;
    private ListView  mLvContent;
    private TextView  mFootView;
    private TextView  mHeadView;
   
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       initView();
       initData();
       initListener();
    }
 
   
 
    private void initView() {
//     加载布局，并获取里面的控件
       setContentView(R.layout.comment_page);
       mIbBack = (ImageButton) findViewById(R.id.ib_comment_back);
       mTvTitle = (TextView) findViewById(R.id.tv_comment_title);
       mLvContent = (ListView) findViewById(R.id.lv_comment_content);
//     为ListView加上头布局
       initHeadView();
//     为ListView加上尾布局
       initFootView();
      
    }
 
    private void initFootView() {
      
       mFootView = new TextView(CommentActivity.this);
       mFootView.setPadding(10, 10, 10, 10);
//     ListView的尾布局是一个TextView
       mLvContent.addFooterView(mFootView);
    }
 
    private void initHeadView() {
       mHeadView = new TextView(CommentActivity.this);
       mHeadView.setPadding(10, 10, 10, 10);
//     ListView的头布局是一个TextView
       mLvContent.addHeaderView(mHeadView);
      
    }
}