Android 前端内容
4.1 View 类概述
4.1.1 关于 View
//类型说明
view(视图）指的是用户界面组件的基本构建基块。一个视图占据屏幕上的矩形区域，负责绘图和事件处理。视图是基类的小部件，用来创建交互式用户界面组件 (如按钮、 文本字段等)。
//参数提供
4.1.2 关于 ViewGroup
//类型说明
//参数提供
4.2 布局
4.2.1 相对布局 RelativeLayout
//类型说明
//参数提供
//代码化说明
//对main.xml的片段代码讲解
//对activity_RelativeLayoutActivity.java的片段代码讲解
//完整代码举例
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="cn.com.sgmsc.Relative.Activity_RelativeLayoutActivity"> <TextView
android:id="@+id/label"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="在此处输入:" />
<!--
android:background="@android:drawable/editbox_background" 设置组件的背景
android:layout_below="@id/label" 先设置相对的属性，再获取所需的ID
-->
<EditText
android:id="@+id/entry"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@android:drawable/editbox_background"
android:layout_below="@id/label"/>
<Button
android:id="@+id/Ok"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="onClick"
android:layout_below="@id/entry"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="确定" />
<Button
android:id="@+id/Cancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="onClick"
android:layout_toLeftOf="@id/Ok"
android:layout_alignTop="@id/Ok"
android:text="删除" />
</RelativeLayout>
main.xml
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.EditText;
import android.widget.Toast; public class Activity_RelativeLayoutActivity extends AppCompatActivity { private EditText editText; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main); editText = (EditText) findViewById(R.id.entry);
} public void onClick(View view){
switch (view.getId()){
case R.id.Ok:
Toast.makeText(this,"输入的数据:"+editText.getText(),Toast.LENGTH_SHORT).show();
break;
case R.id.Cancel:
if(editText.getText().length()>0)
Toast.makeText(this,"删除数据",Toast.LENGTH_SHORT).show();
else
Toast.makeText(this,"没有数据",Toast.LENGTH_SHORT).show();
editText.setText("");
break;
default:
break;
}
}
}
activity_RelativeLayout.java
4.2.2 线性布局 LinearLayout
//类型说明
//参数提供
//代码化说明
//完整代码举例
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
tools:context="cn.com.sgmsc.Line.Activity_LineLayoutActivity"> <!--
id="@+id/自己取的名字“ 所取的名字，必须是唯一，最好存在某种意义，
id="@id/取别人的名字” 例如：在相对布局中，就是获取其它的组件id,来识别相应组件的位置
组件、布局都需要其高度/宽度 wrap_contentr的大小是根据组件中文本大小及数量来决定
match_parent的大小是尽可能的占领空白空间
text="输入所要的文本内容"
layout_weight：表示权重，在线性布局中，权重的大小影响了组件在布局中显示的大及组件间的关系
android:onClick="onClick" 设置该组件在业务逻辑中可以进行事件处理，这一步骤让组件在
Activity_LineLayoutActivity.java无需定义组件，就可以直接进行业务逻辑
还有其它参数，没有使用，强烈希望读者可以尝试。
-->
<Button android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello, I am a Button1"
android:onClick="onClick"
android:layout_weight="1" />
<Button android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello, I am a Button2"
android:onClick="onClick"
android:layout_weight="1" />
<Button android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello, I am a Button3"
android:onClick="onClick"
android:layout_weight="1" />
<Button android:id="@+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello, I am a Button4"
android:onClick="onClick"
android:layout_weight="1" />
<Button android:id="@+id/button5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello, I am a Button5"
android:onClick="onClick"
android:layout_weight="1" />
</LinearLayout>
main.xml
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Toast; public class Activity_LineLayoutActivity extends AppCompatActivity { @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//获取布局文件
setContentView(R.layout.main);
} //此对象，对应main.xml文件中，组件的android:onClick="onClick"
//此对象，用来对组件进行业务逻辑
public void onClick(View view){
//通过判断组件的Id,来确定相应的组件
switch (view.getId()){
case R.id.button1: //如果是按钮1，则进行业务逻辑
Toast.makeText(this, "你点击的是按钮 1", Toast.LENGTH_SHORT).show(); //显示屏中弹出提示框
break;
case R.id.button2://如果是按钮2，则进行业务逻辑
Toast.makeText(this, "你点击的是按钮 2", Toast.LENGTH_SHORT).show();
break;
case R.id.button3:
Toast.makeText(this, "你点击的是按钮 3", Toast.LENGTH_SHORT).show();
break;
case R.id.button4:
Toast.makeText(this, "你点击的是按钮 4", Toast.LENGTH_SHORT).show();
break;
case R.id.button5:
Toast.makeText(this, "你点击的是按钮 5", Toast.LENGTH_SHORT).show();
break;
default:
break;
}
}
}
Activity_LinearLayout.java
4.2.3 表格布局 TableLayout
<?xml version="1.0" encoding="utf-8"?>
<TableLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:stretchColumns="0,1,2"
tools:context=".Activity_TableLayoutActivity"> <!--
android:stretchColumns 设置可伸展的列。该列可以向行方向伸展，最多可占据一整行。
android:shrinkColumns 设置可收缩的列。当该列子控件的内容太多，已经挤满所在行，那么该子控件的内容将往列方向显示。
android:collapseColumns 设置要隐藏的列 TableLayout：表格布局
TableRow ： 行，必需给
<TableRow> 所设的组件，都放在同一行
设置组件
</TableRow>
--> <TableRow><!-- row1 -->
<Button android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="按钮1"
android:onClick="onClick"
android:layout_column="0" />
<Button android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="按钮2"
android:onClick="onClick"
android:layout_column="1" />
</TableRow>
<TableRow><!-- row2 -->
<Button android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="按钮3"
android:onClick="onClick"
android:layout_column="1" />
<Button android:id="@+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="按钮4"
android:onClick="onClick"
android:layout_column="1" />
</TableRow>
<TableRow ><!-- row3 -->
<Button android:id="@+id/button5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="按钮5"
android:onClick="onClick"
android:layout_column="2" />
</TableRow>
</TableLayout>
main.xml
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Toast; public class Activity_TableLayoutActivity extends AppCompatActivity { @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
} public void onClick(View view){
switch (view.getId()){
case R.id.button1:
Toast.makeText(this,"这个按钮在第一行第一列",Toast.LENGTH_SHORT).show();
break;
case R.id.button2:
Toast.makeText(this,"这个按钮在第一行第二列",Toast.LENGTH_SHORT).show();
break;
case R.id.button3:
Toast.makeText(this,"这个按钮在第二行第二列",Toast.LENGTH_SHORT).show();
break;
case R.id.button4:
Toast.makeText(this,"这个按钮在第二行第三列",Toast.LENGTH_SHORT).show();
break;
case R.id.button5:
Toast.makeText(this,"这个按钮在第三行第三列",Toast.LENGTH_SHORT).show();
break;
}
}
}
Activity_TableLayout.java
4.2.4 帧布局 FrameLayout
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="cn.com.sgmsc.Frame.Activity_FrameLayout"> <!--
这个帧布局中放入三个按钮，按钮间的位置中叠加式的，处于最底部位置是从先放入的组件开始的，
处于最顶部位置的是最后放入的组件，其它部件的位置以此类推
从界面显示的效果可知
-->
<!--红色-->
<Button
android:layout_width="350sp"
android:layout_height="350sp"
android:layout_gravity="center"
android:background="@color/colorAccent"/> <!--蓝色-->
<Button
android:layout_width="250sp"
android:layout_height="250sp"
android:layout_gravity="center"
android:background="@color/colorPrimary"/> <!--淡青铜色-->
<Button
android:layout_width="150sp"
android:layout_height="150sp"
android:layout_gravity="center"
android:background="@color/colorPrimaryDark"/>
</FrameLayout>
main.xml 不含业务处理
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="cn.com.sgmsc.Frame.Activity_FrameLayout"> <!--
这个帧布局中放入三个按钮，按钮间的位置中叠加式的，处于最底部位置是从先放入的组件开始的，
处于最顶部位置的是最后放入的组件，其它部件的位置以此类推
从界面显示的效果可知
-->
<!--红色-->
<Button
android:id="@+id/Button_red"
android:onClick="onClick"
android:layout_width="350sp"
android:layout_height="350sp"
android:layout_gravity="center"
android:background="@color/colorAccent"/> <!--蓝色-->
<Button
android:id="@+id/Button_blue"
android:onClick="onClick"
android:layout_width="250sp"
android:layout_height="250sp"
android:layout_gravity="center"
android:background="@color/colorPrimary"/> <!--淡青铜色-->
<Button
android:id="@+id/Button_bronze"
android:onClick="onClick"
android:layout_width="150sp"
android:layout_height="150sp"
android:layout_gravity="center"
android:background="@color/colorPrimaryDark"/>
</FrameLayout>
main.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="colorPrimary">#3F51B5</color>
<color name="colorPrimaryDark">#95de5e</color>
<color name="colorAccent">#FF4081</color>
</resources>
Color.xml
import android.app.Activity;
import android.graphics.Color;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast; import static android.graphics.Color.BLUE; public class Activity_FrameLayout extends Activity { private Button button_red,button_blue,button_bronze; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main); button_red = (Button) findViewById(R.id.Button_red);
button_blue = (Button) findViewById(R.id.Button_blue);
button_bronze= (Button) findViewById(R.id.Button_bronze); } public void onClick(View view){
switch (view.getId()){
case R.id.Button_red:
button_red.setBackgroundColor(Color.parseColor("#adaf23"));
button_blue.setBackgroundColor(Color.parseColor("#3F51B5"));
button_bronze.setBackgroundColor(Color.parseColor("#95de5e"));
break;
case R.id.Button_blue:
button_red.setBackgroundColor(Color.parseColor("#FF4081"));
button_blue.setBackgroundColor(Color.parseColor("#FF02DE"));
button_bronze.setBackgroundColor(Color.parseColor("#95de5e"));
break;
case R.id.Button_bronze:
button_red.setBackgroundColor(Color.parseColor("#FF4081"));
button_blue.setBackgroundColor(Color.parseColor("#3F51B5"));
button_bronze.setBackgroundColor(Color.parseColor("#2ad5ca"));
break;
}
}
}
Activity_FrameLayout.java
4.2.5 绝对布局 AbsoluteLayout
绝对布局指的是组件固定在手机界面的某一位置。
在现代中的智能手机，其屏幕大小各异、像素不统一，并且手机还会继续变化。
使其组件在某些屏幕上无法按原先设计的界面，正常显示出来。
说句话题外话，笔者就因一款学习外语的软件，它是固定横界面的。因笔者手机的问题，需要它变换界面的方向，才可以继续使用它。它死活不会让手机界面向另外一边横向，或者纵向。笔者只好弃用它了。对于一款面向用户的软件而言。不被使用，简直没有存在的价值。
绝对布局已经过时，因此，笔者不再提供事例代码。推荐读者使用其它布局。
温馨提供：如果没充分的理由，不要把界面、组件写死。
4.3 组件
部件（Widget）是为构建用户交互界面提供服务的视图对象。Android和其他开发语言一样，提供一套完整的部件实现。常用的Widget包括TextView、EditText、Button、RadioButton、Checkbox和 ScrollView等。由于它们每一个都可以与用户进行交互，所以把Widget类中的每一个部件称为控件。
Widget类是View类的子类，Widget内的所有控件都继承了View类中的属性和方法。可以在android.widget包中找到Android提供的控件列表。下面分别进行介绍。
4.3.1 显示文本（TextView）与 显示图片（ImageView）
TextView（文本框）是用来向用户显示文本内容的控件。它在android.widget.TextView包中定义，如果在Java类设计中使用它，则需要在相应的代码文件前部加上“import android.widget.TextView;”。
TextView控件中有很多可以在XML文件中设置的属性，这些属性同样可以在代码中以方法动态声明。常用的属性和对应的方法如表4.8所示。
表4.8 TextView常用的属性和对应方法说明
属性 方法 描述
android:gravity setGravity(int) 设置TextView在x轴和y轴方向上的显示方式
android:height setHeight(int) 设置TextView的高度，以像素为单位
android:width setWidth(int) 设置TextView的宽度，以像素为单位
android:hint setHint(int) 当TextView中显示的文本内容为空时，显示的文本提示信息
android:padding setPadding(int) 设置TextView中显示文本与其父容器边界的间距
android:text setText(CharSequence) 为TextView设置显示的文本内容
android:textColor setTextColor(ColorStateList) 设置TextView 的文本颜色
android:typeface setTypeface(Typeface) 设置TextView 的文本字体
android:textSize setTextSize(float) 设置TextView 的文本大小
android:textStyle setTextStyle(TextStyle) 设置TextView 的文本字形，如粗体、斜体等
在使用中，要注意一些属性的区别。
1. android:gravity与android:layout_gravity的区别
android:gravity用于设置这个View内的所有子元素的对齐方式，而android:layout_gravity用于设置这个View在其父容器中的对齐方式。
2. android:padding与android:layout_margin的区别
padding是站在父View的角度描述问题的，它规定它里面的内容必须与这个父View边界的距离。而margin则是站在自己的角度描述问题的，规定自己和其他（上下左右）的View之间的距离，如果同一级只有一个View，那么它的效果基本上就和padding一样了。
<TextView
android:layout_width="wrap_content" //文本框的宽度
android:layout_height="match_parent" //文本框的高度
android:text="sows" //文本的内容
android:textSize="23sp" //字体的大小
android:textColor="#aacc22" //字体的颜色
android:gravity="center"/> //字体相对文本框的位置
4.3.2 编辑文本框 EditView
4.3.3 按钮 Button 与 图片按钮 (ImageButton)
4.3.4 单选按钮（CheckBox）与 多选按钮 (RadioButton)
4.3.5 模拟时钟（AnalogClock）与 数字时钟 （DigitalClock）
4.3.6 日期选择（DatePicker）与 时间选择 （TimePicker）
4.4 UI设计案例
4.4.1 计算器界面
4.4.2 掌上微博
4.5 总结
4.6 题目
4.7 设计类读物
4.8 汉英语对照表
---恢复内容结束---