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

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

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

以下是基本构思图




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

>
<LinearLayout xmlns:andro
    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:
            android:layout_width="match_parent"
            android:layout_height="fill_parent"
            android:layout_marginTop="0dp"
            android:layout_weight="1"
            android:padding="0dp" />

        <TextView
            android:
            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:
                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:
                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:
                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:
                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:
                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:
                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:
                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:
                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:
                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:
                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:
                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:
                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:
                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:
                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:
                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:
                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:
                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:
                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:
                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:layout_weight的真实含义



下节预报：
滚动视图ScrollView