Android 自定义TextView控件,用来组成表格方便数据的展示。
首先看一下效果
样式不是很好看,需要用的可以自己优化一下。
实现方式很简单。
1、自定义控件 MyTableTextView 继承 TextView 重写onDraw方法。在里面添加话边框的操作。
1 package lyf.com.mytableview; 2 3 import android.content.Context; 4 import android.graphics.Canvas; 5 import android.graphics.Color; 6 import android.graphics.Paint; 7 import android.util.AttributeSet; 8 import android.widget.TextView; 9 10 /** 11 * lyf on 2016/06/27 12 * 自定义TextView 13 */ 14 public class MyTableTextView extends TextView { 15 16 Paint paint = new Paint(); 17 18 public MyTableTextView(Context context, AttributeSet attrs) { 19 super(context, attrs); 20 int color = Color.parseColor("#80b9f2"); 21 // 为边框设置颜色 22 paint.setColor(color); 23 } 24 25 @Override 26 protected void onDraw(Canvas canvas) { 27 super.onDraw(canvas); 28 // 画TextView的4个边 29 canvas.drawLine(0, 0, this.getWidth() - 1, 0, paint); 30 canvas.drawLine(0, 0, 0, this.getHeight() - 1, paint); 31 canvas.drawLine(this.getWidth() - 1, 0, this.getWidth() - 1, this.getHeight() - 1, paint); 32 canvas.drawLine(0, this.getHeight() - 1, this.getWidth() - 1, this.getHeight() - 1, paint); 33 } 34 }
2、主布局,什么也不用写。直接放一个LinearLayout就好。但因为表格的宽度和高度往往超过屏幕的宽高度,因此需要我们添加ScrollView 和HorizontalScrollView。为了让HorizontalScrollView填满整个ScrollView 需要在ScrollView设置属性 android:fillViewport="true"。
<?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="match_parent" android:orientation="vertical"> <ScrollView android:layout_width="match_parent" android:layout_height="match_parent" android:fillViewport="true" android:scrollbars="none" > <HorizontalScrollView android:id="@+id/scroll_view" android:layout_width="match_parent" android:layout_height="match_parent" android:scrollbarAlwaysDrawHorizontalTrack="false" android:scrollbars="none"> <LinearLayout android:id="@+id/MyTable" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginBottom="9dp" android:orientation="vertical" > </LinearLayout> </HorizontalScrollView> </ScrollView> </LinearLayout>
3、接下来写表格显示的样式文件table.xml。该布局文件用来显示表格每一行的样式。
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="match_parent"> <lyf.com.mytableview.MyTableTextView android:id="@+id/list_1_1" android:layout_width="50dp" android:layout_height="wrap_content" android:layout_alignBottom="@+id/list_1_2" android:layout_alignTop="@+id/list_1_2" android:gravity="center" android:textColor="#000" android:textSize="13sp" /> <lyf.com.mytableview.MyTableTextView android:id="@+id/list_1_2" android:layout_width="180dp" android:layout_height="wrap_content" android:layout_toRightOf="@+id/list_1_1" android:gravity="center" android:textColor="#000" android:textSize="13sp" /> <lyf.com.mytableview.MyTableTextView android:id="@+id/list_1_3" android:layout_width="100dp" android:layout_height="wrap_content" android:layout_alignBottom="@+id/list_1_2" android:layout_alignTop="@+id/list_1_2" android:layout_toRightOf="@+id/list_1_2" android:gravity="center" android:textColor="#000" android:textSize="13sp" /> <lyf.com.mytableview.MyTableTextView android:id="@+id/list_1_4" android:layout_width="100dp" android:layout_height="wrap_content" android:layout_alignBottom="@+id/list_1_3" android:layout_alignTop="@+id/list_1_3" android:layout_toRightOf="@+id/list_1_3" android:gravity="center" android:textColor="#000" android:textSize="13sp" /> <lyf.com.mytableview.MyTableTextView android:id="@+id/list_1_5" android:layout_width="100dp" android:layout_height="wrap_content" android:layout_alignBottom="@+id/list_1_4" android:layout_alignTop="@+id/list_1_4" android:layout_toRightOf="@+id/list_1_4" android:gravity="center" android:textColor="#000" android:textSize="13sp" /> <lyf.com.mytableview.MyTableTextView android:id="@+id/list_1_6" android:layout_width="100dp" android:layout_height="wrap_content" android:layout_alignBottom="@+id/list_1_5" android:layout_alignTop="@+id/list_1_5" android:layout_toRightOf="@+id/list_1_5" android:gravity="center" android:textColor="#000" android:textSize="13sp" /> <lyf.com.mytableview.MyTableTextView android:id="@+id/list_1_7" android:layout_width="100dp" android:layout_height="wrap_content" android:layout_alignBottom="@+id/list_1_6" android:layout_alignTop="@+id/list_1_6" android:layout_toRightOf="@+id/list_1_6" android:gravity="center" android:textColor="#000" android:textSize="13sp" /> </RelativeLayout>
4、最后把数据放到我们的table.xml文件中,并显示到我们的主布局文件中。
package lyf.com.mytableview; import android.app.Activity; import android.graphics.Color; import android.os.Bundle; import android.view.LayoutInflater; import android.widget.LinearLayout; import android.widget.RelativeLayout; /** * lyf on 2016/06/27 * 自定义表格显示 */ public class MainActivity extends Activity { private LinearLayout mainLinerLayout; private RelativeLayout relativeLayout; private String[] name={"序号","考号","姓名","出生年月","语文","数学","英语"}; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mainLinerLayout = (LinearLayout) this.findViewById(R.id.MyTable); initData(); } //绑定数据 private void initData() { //初始化标题 relativeLayout = (RelativeLayout) LayoutInflater.from(this).inflate(R.layout.table, null); MyTableTextView title = (MyTableTextView) relativeLayout.findViewById(R.id.list_1_1); title.setText(name[0]); title.setTextColor(Color.BLUE); title = (MyTableTextView) relativeLayout.findViewById(R.id.list_1_2); title.setText(name[1]); title.setTextColor(Color.BLUE); title = (MyTableTextView) relativeLayout.findViewById(R.id.list_1_3); title.setText(name[2]); title.setTextColor(Color.BLUE); title = (MyTableTextView) relativeLayout.findViewById(R.id.list_1_4); title.setText(name[3]); title.setTextColor(Color.BLUE); title = (MyTableTextView) relativeLayout.findViewById(R.id.list_1_5); title.setText(name[4]); title.setTextColor(Color.BLUE); title = (MyTableTextView) relativeLayout.findViewById(R.id.list_1_6); title.setText(name[5]); title.setTextColor(Color.BLUE); title = (MyTableTextView) relativeLayout.findViewById(R.id.list_1_7); title.setText(name[6]); title.setTextColor(Color.BLUE); mainLinerLayout.addView(relativeLayout); //初始化内容 int number = 1; for (int i=0;i<10;i++) { relativeLayout = (RelativeLayout) LayoutInflater.from(this).inflate(R.layout.table, null); MyTableTextView txt = (MyTableTextView) relativeLayout.findViewById(R.id.list_1_1); txt.setText(String.valueOf(number)); txt = (MyTableTextView) relativeLayout.findViewById(R.id.list_1_2); txt.setText("320321**********35"); txt = (MyTableTextView) relativeLayout.findViewById(R.id.list_1_3); txt.setText("张三"); txt = (MyTableTextView) relativeLayout.findViewById(R.id.list_1_4); txt.setText("1992/04/21"); txt = (MyTableTextView) relativeLayout.findViewById(R.id.list_1_5); txt.setText("150"); txt = (MyTableTextView) relativeLayout.findViewById(R.id.list_1_6); txt.setText("200"); txt = (MyTableTextView) relativeLayout.findViewById(R.id.list_1_7); txt.setText("120"); mainLinerLayout.addView(relativeLayout); number++; } } }