View畫矩形統計圖(可動態新增)
阿新 • • 發佈:2018-12-29
佈局
<?xml version="1.0" encoding="utf-8"?> <android.widget.LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:orientation="vertical" android:layout_height="match_parent" tools:context=".MainActivity"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal"> <EditText android:id="@+id/nameString" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="10dp" android:layout_weight="1" android:background="@drawable/sty_color" android:hint="姓名" /> <EditText android:id="@+id/num" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:layout_margin="10dp" android:background="@drawable/sty_color" android:hint="成績" app:layout_constraintLeft_toRightOf="@+id/nameString" /> <Button android:id="@+id/button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:layout_margin="10dp" android:background="@drawable/btn_color" android:text="新增" /> </LinearLayout> <zhao.com.demo1.MyView android:id="@+id/myView" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </android.widget.LinearLayout>
畫矩形統計圖
public class MyView extends View { private Paint mLinePaint, mTextPaint, mRectPaint; ArrayList<User> list; public MyView(Context context) { super(context); init(); } public MyView(Context context, AttributeSet attrs) { super(context, attrs); init(); } public MyView(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); init(); } //長寬 測量控制元件的大小,確定寬高 @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); } //測量控制元件的位置,確定上下左右座標 @Override protected void onLayout(boolean changed, int left, int top, int right, int bottom) { super.onLayout(changed, left, top, right, bottom); } private void init() { mLinePaint = new Paint(); //顏色 mLinePaint.setColor(Color.GREEN); //樣式 mLinePaint.setStyle(Paint.Style.STROKE); //寬度 mLinePaint.setStrokeWidth(5); //矩形樣式 mRectPaint = new Paint(); mRectPaint.setColor(Color.BLUE); mRectPaint.setStyle(Paint.Style.FILL); mTextPaint = new Paint(); //字型顏色 mTextPaint.setColor(Color.BLACK); mTextPaint.setStyle(Paint.Style.STROKE); //字型大小 mTextPaint.setTextSize(50); //新增資料 list = new ArrayList<>(); list.add(new User("啊哈",200)); } public void addUser(User user) { list.add(user);//新增資料 this.invalidate();//重新整理View } //繪圖,畫點線矩形圓形的 @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); /* * X軸從200,1000開始到1000,1000結束 * * */ canvas.drawLine(200, 1000, 1000, 1000, mLinePaint); /* * Y軸從200,200開始到200,1000結束 * * */ canvas.drawLine(200, 200, 200, 1000, mLinePaint); for (int i = 0; i <= 8; i++) { int a = i * 100;//Y軸上的數字 /* * 1000+25-a * a=i*100 * * 第i個數字到手機頂部的距離 * * mTextPaint數字的樣式 * * */ canvas.drawText(String.valueOf(a), 100 - 50, 1000 + 25 - a, mTextPaint); // canvas.drawText(i+"",100-50,1000+25-i,mTextPaint);//一般使用String.valueof() } for (int i = 0; i < list.size(); i++) { int j = i * 200;//字型間距 //欄位寬度 float text = mTextPaint.measureText(list.get(i).name); canvas.drawText(list.get(i).name, 300 - text / 2 + j, 1000 + 100, mTextPaint); //畫矩形 Rect rect = new Rect(); rect.left = 300 - 50 + j;//左間距 rect.right = 300 + 50 + j;//右間距 rect.bottom = 1000;//矩形的底部座標,不能變 rect.top = rect.bottom-list.get(i).score;//到頂部的距離 canvas.drawRect(rect,mRectPaint); } } }
動態新增
public class MainActivity extends AppCompatActivity implements View.OnClickListener { EditText nameString; EditText num; Button button; MyView myView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); //尋找控制元件 initView(); //點選事件 button.setOnClickListener(this); } private void initView() { myView = findViewById(R.id.myView); nameString = findViewById(R.id.nameString); num = findViewById(R.id.num); button = findViewById(R.id.button); } @Override public void onClick(View v) { switch (v.getId()) { case R.id.button: //獲取輸入框中的值 String name = nameString.getText().toString().trim(); String shu = num.getText().toString().trim(); //轉成int型別 int num = Integer.parseInt(shu); myView.addUser(new User(name, num)); break; } }
}