android学习笔记（二）—— 常用布局与控件

来源：互联网发布：生化危机6 知乎编辑：程序博客网时间：2024/05/16 06:00

Android学习笔记（二）—— 常用布局与控件

一、写在前面的话

上一篇我们学习了怎么创建项目，并完成了我们的第一个项目——Helloworld，那么接下来我们来学习下android使用最为频繁的常用布局和控件。

二、常用布局

现在android比较常用的布局为4种——LinearLayout（线性布局），RelativeLayout（相对布局）,FrameLayout（层叠布局）,TableLayout（表格布局）。接下来我们用例子来说明每一种布局的样子。

LinearLayout
LinearLayout又称线性布局，是非常常用的布局。正如名称所说，这个布局会将他所包含的控件在线性方向上依次排列，下面我们上图来说明。这里由于只是说明布局的样子，我们就不新建项目了，就在HelloWorld中新建布局文件就好。既然是线性，那就不止一个方向，这里我们通过android:orientation来控件布局的方向是水平方向的还是垂直方向。（这里就不贴代码了，只是简单说明，看看效果就行，下面会有一个完整的例子体验布局和控件的各种用法）

RelativeLayout
RelativeLayout又称为相对布局，是非常常用的布局。他的使用相比LinearLayout更加随意，通过相对位置来让控件出来在布局的任何位置。

    <?xml version="1.0" encoding="utf-8"?>    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"        android:layout_width="match_parent" android:layout_height="match_parent">        <Button            android:id="@+id/button1"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_alignParentLeft="true"            android:layout_alignParentTop="true"            android:text="Button1"/>        <Button            android:id="@+id/button2"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_alignParentRight="true"            android:layout_alignParentTop="true"            android:text="Button2"/>        <Button            android:id="@+id/button3"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_centerInParent="true"            android:text="Button3"/>        <Button            android:id="@+id/button4"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_alignParentLeft="true"            android:layout_alignParentBottom="true"            android:text="Button4"/>        <Button            android:id="@+id/button5"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_alignParentRight="true"            android:layout_alignParentBottom="true"            android:text="Button5"/>    </RelativeLayout>

这里出现一些我们没见过的属性，但它们的名字就可以说明它们的意思了，就是对齐的意思。我们来看看效果就明白了。
这里写图片描述

FrameLayout
FrameLayout又叫层叠布局，比较简单，但比较少用，这种布局没有任何的定位方式，所有的控件都会摆放在布局的左上角。（这里是5个大小不同的TextView，使用android:background来设置颜色）

TableLayout
TableLayout又叫表格布局，可以让我们像表格一样去布局，使用的也不多。这里只贴了第二行的代码。
这里写图片描述

<TableRow>    <Button        android:layout_height="wrap_content"        android:layout_width="wrap_content"        android:layout_span="2"        android:text="21"/>    <Button        android:layout_height="wrap_content"        android:layout_width="wrap_content"        android:text="22"/>    <Button        android:layout_height="wrap_content"        android:layout_width="wrap_content"        android:text="23"/></TableRow>

好了，这里常用的四种布局基本上就已经了解了，接下来我们用一个例子来说明这些布局和常用控件的用法。

三、实现各种控件的例子

首先，我们新建一个项目就叫ViewTest吧，新建时选择BlankActivity，这样studio就会自动给我们新建好MainActivity和activity_main。现在我们打开activity_main，将系统自动生成的RelativeLayout修改为LinearLayout，并将其方向设为垂直方向（android:orientation），然后我们开始写我们的第一个布局（布局内套布局），先把代码贴上

<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"       tools:context=".MainActivity"       android:orientation="vertical">    <LinearLayout        android:layout_width="match_parent"        android:layout_height="wrap_content">        <TextView            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:textColor="#000000"            android:text="这是例子"/>        <EditText            android:id="@+id/edit_text1"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="4"            android:hint="这是LinearLayout布局"/>        <Button            android:id="@+id/button1"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:text="Click"/>    </LinearLayout></LinearLayout>

这里写图片描述

这里我们看到有两个LinearLayout，第一个LinearLayout是整体布局，用于控制整个界面，第二个LinearLayout则是嵌套在第一个布局里的布局，在以后我们的项目中这样布局会很常见。在第二个布局里我们发现我们并没有设置android:orientation，那么系统就会默认为horizontal即水平方向。在这个布局里，我们使用了三个常用控件——TextView（文字显示），EditText（输入框），Button（按键）。在上一篇我们已经知道了控件的宽度和高度的设置，但这里我们发现每个控件的宽度都为0dp，这是怎么回事呢？原来这里我们给每一个控件都设置了另外一个属性android:layout_weight,那么宽度就由这个属性来控制了，这个属性的意思是将LinearLayout下的所有指定的layout_weight值相加，得到一个总值，然后每个控件所占大小的比例就是该控件的layout_weight除以刚才算数的总值。比如我这份代码里的EditText就占了6份中的4份，其余两个各占一份。在EditText里有个属性android:hint用于显示提示性消息。这里还有android:id这个也是之前没遇到的，这表示这个控件的id。好，接下来我们添加RelativeLayout布局。（下面就不贴全部代码，只贴新加的代码）

   <RelativeLayout    android:layout_width="match_parent"    android:layout_height="wrap_content">    <ImageView        android:id="@+id/image1"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:src="@mipmap/ic_launcher"/>    <TextView        android:id="@+id/textview1"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_toRightOf="@id/image1"        android:layout_centerInParent="true"        android:text="这是RelativeLayout"        android:textSize="18sp"/>    <ProgressBar        android:id="@+id/progressbar"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_toRightOf="@id/textview1"/>    <Button        android:id="@+id/button2"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_toRightOf="@id/progressbar"        android:text="切换"/></RelativeLayout>

这里写图片描述

这个布局里面我们添加了一个ImageView用于显示图片，一个TextView，一个ProgressBar用于在屏幕上显示一个进度条，一般表示我们程序正在加载一些数据，还有一个button之后在程序里会设置切换ProgressBar的显示与否。好了我们布局完成。接下来，我们来写MainActivity，下面我就直接上代码了。

public class MainActivity extends ActionBarActivity implements View.OnClickListener{private EditText mEditText;private Button mButton1;private Button mButton2;private ProgressBar mProgressBar;@Overrideprotected void onCreate(Bundle savedInstanceState) {    super.onCreate(savedInstanceState);    setContentView(R.layout.activity_main);    //用findViewById()方法获取到在布局文件中定义的元素    mButton1 = (Button)findViewById(R.id.button1);    mButton2 = (Button)findViewById(R.id.button2);    mEditText = (EditText)findViewById(R.id.edit_text1);    mProgressBar = (ProgressBar)findViewById(R.id.progressbar);    /**     * 这里有两种写法来为按键注册监听，点击按键就会执行监听器里的onClick()方法。     * 一种是内部类的方式，另一种是实现（implements）OnClickListener接口     * 下面的是内部类方式，这种方式适合按键较少时使用     * 这里选中注释的快捷键是 Ctrl + /     *///        mButton1.setOnClickListener(new View.OnClickListener() {//            @Override//            public void onClick(View v) {//                String inputText = mEditText.getText().toString();//                Toast.makeText(MainActivity.this,inputText,Toast.LENGTH_SHORT).show();//            }//        });////        mButton2.setOnClickListener(new View.OnClickListener() {//            @Override//            public void onClick(View v) {//                if (mProgressBar.getVisibility() == View.GONE) {//                    mProgressBar.setVisibility(View.VISIBLE);//                } else {//                    mProgressBar.setVisibility(View.GONE);//                }//            }//        });    mButton1.setOnClickListener(this);    mButton2.setOnClickListener(this);}    @Override    public void onClick(View v) {        switch (v.getId()) {            case R.id.button1:                //这里用getText().toString()方法来获得输入框输入的值                String inputText = mEditText.getText().toString();            /**             * Toast是android提供的一个很好的提醒方式，             * 在程序中可以使用他将一些短小的信息通知给用户，一段时间后自动消失，             * 不占用任何屏幕控件             * Toast的使用方式是使用一个静态方法makeText()创建一个Toast对象，             * 然后调用.show()方法来显示             * makeText()方法传入了三个参数，第一个是Context，即上下文，一般传入当前活动即可。             * 第二个是Toast要显示的内容。             * 第三个是Toast要显示的时长，有两个内置常量Toast.LENGTH_SHORT和LENGTH_LONG             */                Toast.makeText(MainActivity.this, inputText, Toast.LENGTH_SHORT).show();                break;            case R.id.button2:            /**             * 所有的android控件都有一个属性——可见属性。通过android:visibility来设置，             * 可选值为visible,invisible和gone。visible表示控件可见，这个值是默认值。             * invisible表示不可见，但他仍会占据原来的位置和大小（也可以说是变的透明了）。             * gone表示控件不仅不可见，而且不再占用任何屏幕空间。             * 下面我们通过按键来设置mProgressBar的是否可见             */                if (mProgressBar.getVisibility() == View.GONE) {                    mProgressBar.setVisibility(View.VISIBLE);                } else {                    mProgressBar.setVisibility(View.GONE);                }        }    }}

这里写图片描述

好了，到这里基本常用的布局与控件就说的差不多了，当然还有很多用法我还没提到（比如最重要的ListView还没说，这个留到后面，还有一些基础知识比如dp和sp啊，这些后面都会谈到），这就需要大家在平常的使用中多查多看，善用谷歌和百度。下一篇我们讲会谈到android四大组件之一Activity。有什么问题可以给我留言，下篇见。谢谢。

转载请注明：http://blog.csdn.net/jiang89125/article/details/48350299

（用这个Markdown还是用的不太习惯，代码块不能高亮，下次还是用旧的编辑吧）

0 0