【风马一族_Android】Android 前端内容1

　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 汉英语对照表

　　

　　

　　

　　

---恢复内容结束---