疯狂Android讲义（第3版）学习笔记（第二章---界面编程）

来源：互联网发布：热血战歌源码编辑：程序博客网时间：2024/06/09 02:58

1，代码控制UI界面

一般我们的UI布局都是在xml文件中调整的，这里练习一下在activity中设置UI布局

import android.content.Context;import android.os.Bundle;import android.support.v7.app.AppCompatActivity;import android.util.TypedValue;import android.view.View;import android.view.ViewGroup;import android.widget.Button;import android.widget.LinearLayout;import android.widget.Toast;public class MainActivity extends AppCompatActivity implements View.OnClickListener {    private Context mContext = MainActivity.this;    private int mTenDp;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        LinearLayout linearLayout = new LinearLayout(mContext);        setContentView(linearLayout);        linearLayout.setOrientation(LinearLayout.VERTICAL);        mTenDp = DensityUtil.dp2px(mContext, 10);        // 转为dp单位        linearLayout.setPadding(mTenDp *2, mTenDp, mTenDp *2, mTenDp);        Button button = new Button(mContext);        // 向线性布局中添加View        linearLayout.addView(button);        // 设置Button在父布局中的显示方式        button.setLayoutParams(new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,                ViewGroup.LayoutParams.MATCH_PARENT));        // 和布局中设置的@string/button的位置是一样的        button.setText(R.string.button);        // 转为sp单位        button.setTextSize(TypedValue.COMPLEX_UNIT_SP , 18);        button.setOnClickListener(this);    }    @Override    public void onClick(View view) {        Toast.makeText(mContext, "HelloWorld!", Toast.LENGTH_SHORT).show();    }}

2，自定义View之跟随手指移动的小球

简单练习了一个小球随手指移动的自定义控件的代码编写

//（View）DrawViewimport android.content.Context;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.util.AttributeSet;import android.view.MotionEvent;import android.view.View;/** * 自定义一个随手指不断移动的小球 */public class DrawView extends View{    // 圆心坐标    int circleX = 100;    int circleY = 100;    // 创建一个画笔    Paint mPaint = new Paint();    // 重写三个构造    public DrawView(Context context) {        this(context , null);    }    public DrawView(Context context, AttributeSet attrs) {        this(context, attrs , 0);    }    public DrawView(Context context, AttributeSet attrs, int defStyleAttr) {        super(context, attrs, defStyleAttr);    }    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        // 画笔指定圆球颜色        mPaint.setColor(Color.BLUE);        // 画布指定圆心 半径和画笔        canvas.drawCircle(circleX ,circleY , 100 , mPaint);    }    @Override    public boolean onTouchEvent(MotionEvent event) {        // 获取目前触摸位置的x和y坐标        circleX = (int) event.getX();        circleY = (int) event.getY();        // 通知当前组件重绘自己        invalidate();        // 返回true表示事件已处理        return true;    }}----------------------------------------------------------------------------------------//(layout)activity_main<LinearLayout    xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/activity_main"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical"    tools:context="com.test.drawview.MainActivity">    <com.test.drawview.DrawView        android:layout_width="match_parent"        android:layout_height="match_parent"/></LinearLayout>----------------------------------------------------------------------------------------// MainActivity import android.app.Activity;import android.os.Bundle;public class MainActivity extends Activity {    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);    }}

3，霓虹灯效果

这里写图片描述

熟悉帧布局是一层盖一层的；同一类控件做了同样的事情，可以考虑用数组的方式定义并初始化；更新UI必须在UI线程中进行

//(layout)activity_main<FrameLayout    xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/activity_main"    android:layout_width="match_parent"    android:layout_height="match_parent"    tools:context="com.test.framelayout.MainActivity">    <TextView        android:id="@+id/red"        android:layout_gravity="center"        android:layout_width="350dp"        android:layout_height="350dp"/>    <TextView        android:id="@+id/orange"        android:layout_gravity="center"        android:layout_width="300dp"        android:layout_height="300dp"/>    <TextView        android:id="@+id/yellow"        android:layout_gravity="center"        android:layout_width="250dp"        android:layout_height="250dp"/>    <TextView        android:id="@+id/green"        android:layout_gravity="center"        android:layout_width="200dp"        android:layout_height="200dp"/>    <TextView        android:id="@+id/cyan"        android:layout_gravity="center"        android:layout_width="150dp"        android:layout_height="150dp"/>    <TextView        android:id="@+id/blue"        android:layout_gravity="center"        android:layout_width="100dp"        android:layout_height="100dp"/>    <TextView        android:id="@+id/purple"        android:layout_gravity="center"        android:layout_width="50dp"        android:layout_height="50dp"/></FrameLayout>----------------------------------------------------------------------------------------//(value)colors<resources>    <color name="colorRed">#FF0000</color>    <color name="colorOrange">#FF8000</color>    <color name="colorYellow">#FFFF00</color>    <color name="colorGreen">#00FF00</color>    <color name="colorCyan">#00FFFF</color>    <color name="colorBlue">#0000FF</color>    <color name="colorPurple">#8000FF</color></resources>----------------------------------------------------------------------------------------//MainActivityimport android.os.Bundle;import android.os.Handler;import android.os.Message;import android.support.v7.app.AppCompatActivity;import android.widget.TextView;import java.util.Timer;import java.util.TimerTask;public class MainActivity extends AppCompatActivity {    private static final int COLORCHANGE = 1;    private int currentColor = 0;    private TextView[] mTextViews;    private Timer mTimer;    private int[] mColors;    private int[] mIds;    private Handler mHandler = new Handler(){        @Override        public void handleMessage(Message msg) {            switch (msg.what){                case COLORCHANGE:                    // 更改颜色                    for(int i = 0 ; i < mColors.length ; i++){                        mTextViews[i].setBackgroundResource(mColors[ (i + currentColor) % mColors.length]);                    }                    currentColor++;                break;            }            super.handleMessage(msg);        }    };    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        initView();        initData();    }    public void initView(){        mColors = new int[]{                R.color.colorRed,                R.color.colorOrange,                R.color.colorYellow,                R.color.colorGreen,                R.color.colorCyan,                R.color.colorBlue,                R.color.colorPurple        };        mIds = new int[]{             R.id.red,             R.id.orange,             R.id.yellow,             R.id.green,             R.id.cyan,             R.id.blue,             R.id.purple        };        mTextViews = new TextView[mColors.length];        for (int i = 0; i < mColors.length ; i++){            mTextViews[i] = (TextView) findViewById(mIds[i]);        }    }    public void initData(){        Timer timer = new Timer();        // 三个参数含义:定时执行的任务/第一次多久后执行/每隔多久执行        timer.schedule(new TimerTask() {            @Override            public void run() {                // 发送消息 让UI线程更改UI                mHandler.sendEmptyMessage(COLORCHANGE);            }        },0,100);    }}

4，计算器布局界面

这里写图片描述

熟悉表格布局的表示形式

//(layout)activity_main<!--指定计算机的总体布局是6行4列--><GridLayout    xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/gridlayout"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:rowCount="6"    android:columnCount="4"    tools:context="com.test.gridlayout.MainActivity">    <!-- TextView横跨4列 -->    <TextView        android:layout_width="match_parent"        android:layout_height="100dp"        android:layout_columnSpan="4"        android:gravity="center_vertical"        android:text="0"        android:textSize="60sp"        android:textColor="#000"        android:background="#EEEEEE"        android:paddingLeft="10dp"/>    <!-- Button横跨4列 -->    <Button        android:layout_width="match_parent"        android:layout_height="60dp"        android:layout_columnSpan="4"        android:text="清除"        android:textSize="30sp"        android:textColor="#000"/></GridLayout>----------------------------------------------------------------------------------------//MainActivityimport android.content.Context;import android.os.Bundle;import android.support.v7.app.AppCompatActivity;import android.view.Gravity;import android.widget.Button;import android.widget.GridLayout;public class MainActivity extends AppCompatActivity {    private Context mContext = MainActivity.this;    private GridLayout mGridLayout;    private String[] mChars;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        initView();        initData();    }    public void initView(){        mGridLayout = (GridLayout) findViewById(R.id.gridlayout);        mChars = new String[]{"7" ,"8" ,"9" ,"÷" ,                "4" ,"5" ,"6" ,"×" ,                "1" ,"2" ,"3" ,"-" ,                "." ,"0" ,"=" ,"+" };    }    public void initData(){        for(int i = 0 ; i < mChars.length ; i++){            Button button = new Button(mContext);            // 循环设置文字内容            button.setText(mChars[i]);            button.setTextSize(50);            // 循环按钮摆放位置            // 在TextView和Button后指定Button所在的行            GridLayout.Spec rowSpec = GridLayout.spec(i / 4 + 2);            // 指定Button所在的列            GridLayout.Spec columnSoec = GridLayout.spec(i % 4);            GridLayout.LayoutParams layoutParams = new GridLayout.LayoutParams(rowSpec , columnSoec);            // 左上及中间的形状不变,右下布局以填满GridLayout为宗旨            layoutParams.setGravity(Gravity.FILL);            mGridLayout.addView(button , layoutParams);        }    }}

阅读全文

0 0