从零開始学android<使用嵌套布局实现计算器界面.十七.>

所谓的嵌套布局就是在一个文件里嵌套多个布局文件

<span style="font-size:18px;">  <LinearLayout

        android:layout_width="match_parent"

        android:layout_height="fill_parent"

        android:orientation="vertical" >

<FrameLayout

android:layout_width="match_parent"

        android:layout_height="fill_parent"

        android:orientation="vertical" >

……

……

……

</FrameLayout >

</LinearLayout></span>

接下来使用嵌套布局来实现一个简单计算器的UI效果

以下是基本构思图

从零開始学android<使用嵌套布局实现计算器界面.十七.>

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMzYxNjk3Ng==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="">

使用Xml布局文件设置计算器效果

<span style="font-size:18px;"><?xml version="1.0" encoding="utf-8"?

>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical" >

    <LinearLayout

        android:layout_width="match_parent"

        android:layout_height="fill_parent"

        android:layout_weight="3"

        android:orientation="vertical" >

        <TextView

            android:id="@+id/text2"

            android:layout_width="match_parent"

            android:layout_height="fill_parent"

            android:layout_marginTop="0dp"

            android:layout_weight="1"

            android:padding="0dp" />

        <TextView

            android:id="@+id/text1"

            android:layout_width="match_parent"

            android:layout_height="fill_parent"

            android:layout_marginTop="0dp"

            android:layout_weight="2"

            android:padding="0dp" />

    </LinearLayout>

    <TableLayout

        android:layout_width="match_parent"

        android:layout_height="fill_parent"

        android:layout_weight="1"

        android:orientation="vertical" >

        <TableRow

            android:layout_width="match_parent"

            android:layout_height="fill_parent"

            android:layout_weight="0.2" >

            <Button

                android:id="@+id/left_bracket_button"

                android:layout_height="fill_parent"

                android:layout_marginBottom="1dp"

                android:layout_marginLeft="1dp"

                android:layout_weight="0.25"

                android:background="#333333"

                android:text="（"

                android:textColor="@android:color/white"

                android:textSize="25sp" />

            <Button

                android:id="@+id/right_bracket_button"

                android:layout_height="fill_parent"

                android:layout_marginBottom="1dp"

                android:layout_marginLeft="1dp"

                android:layout_weight="0.25"

                android:background="#333333"

                android:text="）"

                android:textColor="@android:color/white"

                android:textSize="25sp" />

            <Button

                android:id="@+id/divisor_button"

                android:layout_height="fill_parent"

                android:layout_marginBottom="1dp"

                android:layout_marginLeft="1dp"

                android:layout_weight="0.25"

                android:background="#333333"

                android:text="÷"

                android:textColor="@android:color/white"

                android:textSize="25sp" />

            <Button

                android:id="@+id/backspace_button"

                android:layout_height="fill_parent"

                android:layout_marginBottom="1dp"

                android:layout_marginLeft="1dp"

                android:layout_weight="0.25"

                android:background="#ffa500"

                android:text="C"

                android:textSize="25sp" />

        </TableRow>

        <TableRow

            android:layout_width="match_parent"

            android:layout_height="fill_parent"

            android:layout_weight="0.2" >

              <Button

                android:id="@+id/seven_button"

                android:layout_height="fill_parent"

                android:layout_width="fill_parent"

                android:layout_weight="0.25"

                android:layout_marginLeft="1dp"

		    	android:layout_marginBottom="1dp"

		    	android:textSize="25sp"

                android:background="@android:color/darker_gray"

                android:text="7" />

            <Button

                android:id="@+id/eight_button"

                android:layout_height="fill_parent"

                android:layout_width="fill_parent"

                android:layout_weight="0.25"

                android:layout_marginLeft="1dp"

		    	android:layout_marginBottom="1dp"

		    	android:textSize="25sp"

                android:background="@android:color/darker_gray"

                android:text="8" />

            <Button

                android:id="@+id/nine_button"

                android:layout_height="fill_parent"

                android:layout_width="fill_parent"

                android:layout_weight="0.25"

                android:layout_marginLeft="1dp"

		    	android:layout_marginBottom="1dp"

		    	android:textSize="25sp"

                android:background="@android:color/darker_gray"

                android:text="9" />

            <Button

                android:id="@+id/product_button"

                android:layout_height="fill_parent"

                android:layout_width="fill_parent"

                android:layout_weight="0.25"

                android:layout_marginLeft="1dp"

		    	android:layout_marginBottom="1dp"

                android:background="#333333"

                android:textSize="25sp"

		    	android:textColor="@android:color/white"

                android:text="×" />

        </TableRow>

        <TableRow

            android:layout_width="match_parent"

            android:layout_height="fill_parent"

            android:layout_weight="0.2" >

            <Button

                android:id="@+id/four_button"

                android:layout_height="fill_parent"

                android:layout_width="fill_parent"

                android:layout_weight="0.25"

                android:layout_marginLeft="1dp"

		    	android:layout_marginBottom="1dp"

		    	android:textSize="25sp"

                android:background="@android:color/darker_gray"

                android:text="4" />

            <Button

                android:id="@+id/five_button"

                android:layout_height="fill_parent"

                android:layout_width="fill_parent"

                android:layout_weight="0.25"

                android:layout_marginLeft="1dp"

		    	android:layout_marginBottom="1dp"

		    	android:textSize="25sp"

                android:background="@android:color/darker_gray"

                android:text="5" />

            <Button

                android:id="@+id/six_button"

                android:layout_height="fill_parent"

                android:layout_width="fill_parent"

                android:layout_weight="0.25"

                android:layout_marginLeft="1dp"

		    	android:layout_marginBottom="1dp"

		    	android:textSize="25sp"

                android:background="@android:color/darker_gray"

                android:text="6" />

            <Button

                android:id="@+id/minus_button"

                android:layout_height="fill_parent"

                android:layout_width="fill_parent"

                android:layout_weight="0.25"

                android:layout_marginLeft="1dp"

		    	android:layout_marginBottom="1dp"

                android:background="#333333"

                android:textSize="25sp"

		    	android:textColor="@android:color/white"

                android:text="-" />

        </TableRow>

        <TableRow

            android:layout_width="match_parent"

            android:layout_height="fill_parent"

            android:layout_weight="0.2" >

             <Button

                android:id="@+id/one_button"

                android:layout_height="fill_parent"

                android:layout_width="fill_parent"

                android:layout_weight="0.25"

                android:layout_marginLeft="1dp"

		    	android:layout_marginBottom="1dp"

		    	android:textSize="25sp"

                android:background="@android:color/darker_gray"

                android:text="1" />

            <Button

                android:id="@+id/two_button"

                android:layout_height="fill_parent"

                android:layout_width="fill_parent"

                android:layout_weight="0.25"

                android:layout_marginLeft="1dp"

		    	android:layout_marginBottom="1dp"

		    	android:textSize="25sp"

                android:background="@android:color/darker_gray"

                android:text="2" />

            <Button

                android:id="@+id/three_button"

                android:layout_height="fill_parent"

                android:layout_width="fill_parent"

                android:layout_weight="0.25"

                android:layout_marginLeft="1dp"

		    	android:layout_marginBottom="1dp"

		    	android:textSize="25sp"

                android:background="@android:color/darker_gray"

                android:text="3" />

            <Button

                android:id="@+id/plus_button"

                android:layout_height="fill_parent"

                android:layout_width="fill_parent"

                android:layout_weight="0.25"

                android:layout_marginLeft="1dp"

		    	android:layout_marginBottom="1dp"

                android:background="#333333"

                android:textSize="25sp"

		    	android:textColor="@android:color/white"

                android:text="+" />

        </TableRow>

        <TableRow

            android:layout_width="match_parent"

            android:layout_height="fill_parent"

            android:layout_weight="0.2" >

            <Button

                android:id="@+id/point_button"

                android:layout_height="fill_parent"

                android:layout_width="wrap_content"

                android:layout_weight="0.5"

                android:layout_marginLeft="1dp"

		    	android:layout_marginBottom="1dp"

		    	android:textSize="40sp"

                android:background="@android:color/darker_gray"

                android:text="." />

            <Button

                android:id="@+id/zero_button"

                android:layout_height="fill_parent"

                android:layout_width="wrap_content"

                android:layout_weight="0.5"

                android:layout_marginLeft="1dp"

		    	android:layout_marginBottom="1dp"

		    	android:textSize="25sp"

                android:background="@android:color/darker_gray"

                android:text="0" />

            <Button

                android:id="@+id/equal_button"

                android:layout_height="fill_parent"

                android:layout_width="wrap_content"

                android:layout_weight="3.1"

                android:layout_marginLeft="1dp"

		    	android:layout_marginBottom="1dp"

		    	android:textSize="25sp"

                android:background="#00CC00"

                android:text="=" />

        </TableRow>

    </TableLayout>

</LinearLayout></span>

以下是模拟器效果图

从零開始学android<使用嵌套布局实现计算器界面.十七.>

上面的代码中重复用到了

<span style="font-size:18px;"> android:layout_weight=""</span>

要想设置好一个布局就必须了解权重的概念android:layout_weight的真实含义

下节预报：

滚动视图ScrollView