Đối với lập trình trên thiết bị di động thiết kế giao diện quá một vấn đề cực kỳ quan trọng. Bởi App của bạn có được người dùng ưa thích không là 1 phần lớn do giao diện của nó. Đặc biệt là đối với lập trình trên android thì thiết kế giao diện Android là một vấn đề cực kỳ khó khăn bởi vì các thiết bị sử dụng android có rất nhiều chủng loại, nhiều kích cỡ màng hình khác nhau.
Vậy làm sao để thiết kế giao diện Android 1 cách đẹp nhất. Hôm nay StudyCoding.Net sẽ hướng dẫn các bạn chương trình "dễ nhất mọi ngôn ngữ" Calculation 
PHP:
<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:background="#FF000000"
    tools:context=".MainActivity" >
    <!-- dòng 1  Nháºp -->
    <TextView
        android:id="@+id/edt_output"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:ems="10"
        android:gravity="right"
        android:textSize="15sp" />
    <TableRow
        android:layout_width="fill_parent"
        android:layout_height="60sp"
        android:background="#FF000000" >
        <EditText
            android:id="@+id/edt"
            android:layout_width="match_parent"
            android:layout_height="60sp"
            android:layout_weight="0.9"
            android:gravity="right"
            android:inputType="number"
            android:text="9x8"
            android:textColor="#FFFFFFFF"
            android:textSize="35sp" >
            <requestFocus />
        </EditText>
    </TableRow>
    <!-- dòng 2 Space vs DELETE -->
    <TableRow
        android:layout_width="fill_parent"
        android:layout_height="60sp"
        android:background="#FF000000" >
        <Button
            android:id="@+id/btnSpace"
            android:layout_width="match_parent"
            android:layout_height="50sp"
            android:layout_marginLeft="2sp"
            android:layout_weight="0.6"
            android:background="#FF252222" >
        </Button>
        <Button
            android:id="@+id/btnDelete"
            android:layout_width="match_parent"
            android:layout_height="50sp"
            android:layout_marginLeft="3sp"
            android:layout_marginRight="2sp"
            android:layout_weight="0.3"
            android:background="#FF252222"
            android:onClick="btnNumberClick"
            android:text="DELETE"
            android:textColor="#FFFFFFFF" >
        </Button>
    </TableRow>
    <TableLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_marginRight="3sp"
        android:layout_marginTop="3sp" >
        <!-- 789 -->
        <TableRow
            android:id="@+id/tableRow1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="0.250" >
            <Button
                android:id="@+id/btnNumber7"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginLeft="2sp"
                android:layout_weight="0.25"
                android:background="#FF746C6C"
                android:onClick="btnNumberClick"
                android:text="7"
                android:textColor="#FFFFFFFF"
                android:textSize="60sp" >
            </Button>
            <Button
                android:id="@+id/btnNumber8"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginLeft="2sp"
                android:layout_weight="0.25"
                android:background="#FF746C6C"
                android:onClick="btnNumberClick"
                android:text="8"
                android:textColor="#FFFFFFFF"
                android:textSize="60sp" >
            </Button>
            <Button
                android:id="@+id/btnNumber9"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginLeft="2sp"
                android:layout_weight="0.25"
                android:background="#FF746C6C"
                android:onClick="btnNumberClick"
                android:text="9"
                android:textColor="#FFFFFFFF"
                android:textSize="60sp" >
            </Button>
            <Button
                android:id="@+id/btnChia"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginLeft="2sp"
                android:layout_weight="0.25"
                android:background="#FF252222"
                android:onClick="btnNumberClick"
                android:text="/"
                android:textColor="#FFFFFFFF"
                android:textSize="40sp" >
            </Button>
        </TableRow>
        <!-- 456 -->
        <TableRow
            android:id="@+id/tableRow2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="2sp"
            android:layout_weight="0.250" >
            <Button
                android:id="@+id/btnNumber4"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginLeft="2sp"
                android:layout_weight="0.25"
                android:background="#FF746C6C"
                android:onClick="btnNumberClick"
                android:text="4"
                android:textColor="#FFFFFFFF"
                android:textSize="60sp" >
            </Button>
            <Button
                android:id="@+id/btnNumber5"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginLeft="2sp"
                android:layout_weight="0.25"
                android:background="#FF746C6C"
                android:onClick="btnNumberClick"
                android:text="5"
                android:textColor="#FFFFFFFF"
                android:textSize="60sp" >
            </Button>
            <Button
                android:id="@+id/btnNumber6"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginLeft="2sp"
                android:layout_weight="0.25"
                android:background="#FF746C6C"
                android:onClick="btnNumberClick"
                android:text="6"
                android:textColor="#FFFFFFFF"
                android:textSize="60sp" >
            </Button>
            <Button
                android:id="@+id/btnNhan"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginLeft="2sp"
                android:layout_weight="0.25"
                android:background="#FF252222"
                android:onClick="btnNumberClick"
                android:text="x"
                android:textColor="#FFFFFFFF"
                android:textSize="40sp" >
            </Button>
        </TableRow>
        <!-- 123 -->
        <TableRow
            android:id="@+id/tableRow3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="2sp"
            android:layout_weight="0.250" >
            <Button
                android:id="@+id/btnNumber1"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginLeft="2sp"
                android:layout_weight="0.25"
                android:background="#FF746C6C"
                android:onClick="btnNumberClick"
                android:text="1"
                android:textColor="#FFFFFFFF"
                android:textSize="60sp" >
            </Button>
            <Button
                android:id="@+id/btnNumber2"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginLeft="2sp"
                android:layout_weight="0.25"
                android:background="#FF746C6C"
                android:onClick="btnNumberClick"
                android:text="2"
                android:textColor="#FFFFFFFF"
                android:textSize="60sp" >
            </Button>
            <Button
                android:id="@+id/btnNumber3"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginLeft="2sp"
                android:layout_weight="0.25"
                android:background="#FF746C6C"
                android:onClick="btnNumberClick"
                android:text="3"
                android:textColor="#FFFFFFFF"
                android:textSize="60sp" >
            </Button>
            <Button
                android:id="@+id/btnTru"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginLeft="2sp"
                android:layout_weight="0.25"
                android:background="#FF252222"
                android:onClick="btnNumberClick"
                android:text="-"
                android:textColor="#FFFFFFFF"
                android:textSize="40sp" >
            </Button>
        </TableRow>
        <!-- . 0 = -->
        <TableRow
            android:id="@+id/tableRow4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="2sp"
            android:layout_marginTop="2sp"
            android:layout_weight="0.250" >
            <Button
                android:id="@+id/btnCham"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginLeft="2sp"
                android:layout_weight="0.25"
                android:background="#FF746C6C"
                android:onClick="btnNumberClick"
                android:text="."
                android:textColor="#FFFFFFFF"
                android:textSize="60sp" >
            </Button>
            <Button
                android:id="@+id/btnNumber0"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginLeft="2sp"
                android:layout_weight="0.25"
                android:background="#FF746C6C"
                android:onClick="btnNumberClick"
                android:text="0"
                android:textColor="#FFFFFFFF"
                android:textSize="60sp" >
            </Button>
            <Button
                android:id="@+id/btnBang"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginLeft="2sp"
                android:layout_weight="0.25"
                android:background="#FF252222"
                android:onClick="btnNumberClick"
                android:text="="
                android:textColor="#FFFFFFFF"
                android:textSize="60sp" >
            </Button>
            <Button
                android:id="@+id/btnCong"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginLeft="2sp"
                android:layout_weight="0.25"
                android:background="#FF252222"
                android:onClick="btnNumberClick"
                android:text="+"
                android:textColor="#FFFFFFFF"
                android:textSize="40sp" >
            </Button>
        </TableRow>
    </TableLayout>
</TableLayout><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:background="#FF000000"
tools:context=".MainActivity" >
<!-- dòng 1 Nhập -->
<TableRow
android:layout_width="fill_parent"
android:layout_height="60sp"
android:background="#FF000000" >
<EditText
android:id="@+id/edt_Output"
android:layout_width="match_parent"
android:layout_height="60sp"
android:layout_weight="0.9"
android:inputType="number"
android:text="9x8"
android:textColor="#FFFFFFFF"
android:textSize="35sp" >
<requestFocus />
</EditText>
</TableRow>
<!-- dòng 2 Space vs DELETE -->
<TableRow
android:layout_width="fill_parent"
android:layout_height="60sp"
android:background="#FF000000" >
<Button
android:id="@+id/btnSpace"
android:layout_width="match_parent"
android:layout_height="50sp"
android:layout_marginLeft="2sp"
android:layout_weight="0.6"
android:background="#FF252222" >
</Button>
<Button
android:id="@+id/btnDelete"
android:layout_width="match_parent"
android:layout_height="50sp"
android:layout_marginLeft="3sp"
android:layout_marginRight="2sp"
android:layout_weight="0.3"
android:background="#FF252222"
android:onClick="btnClick"
android:text="DELETE"
android:textColor="#FFFFFFFF" >
</Button>
</TableRow>
<TableLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginRight="3sp"
android:layout_marginTop="3sp" >
<!-- 789 -->
<TableRow
android:id="@+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.250" >
<Button
android:id="@+id/btnNumber7"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="2sp"
android:layout_weight="0.25"
android:background="#FF746C6C"
android:text="7"
android:textColor="#FFFFFFFF"
android:textSize="60sp" >
</Button>
<Button
android:id="@+id/btnNumber8"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="2sp"
android:layout_weight="0.25"
android:background="#FF746C6C"
android:text="8"
android:textColor="#FFFFFFFF"
android:textSize="60sp" >
</Button>
<Button
android:id="@+id/btnNumber9"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="2sp"
android:layout_weight="0.25"
android:background="#FF746C6C"
android:text="9"
android:textColor="#FFFFFFFF"
android:textSize="60sp" >
</Button>
<Button
android:id="@+id/btnChia"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="2sp"
android:layout_weight="0.25"
android:background="#FF252222"
android:text="/"
android:textColor="#FFFFFFFF"
android:textSize="40sp" >
</Button>
</TableRow>
<!-- 456 -->
<TableRow
android:id="@+id/tableRow2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="2sp"
android:layout_weight="0.250" >
<Button
android:id="@+id/btnNumber4"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="2sp"
android:layout_weight="0.25"
android:background="#FF746C6C"
android:text="4"
android:textColor="#FFFFFFFF"
android:textSize="60sp" >
</Button>
<Button
android:id="@+id/btnNumber5"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="2sp"
android:layout_weight="0.25"
android:background="#FF746C6C"
android:text="5"
android:textColor="#FFFFFFFF"
android:textSize="60sp" >
</Button>
<Button
android:id="@+id/btnNumber6"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="2sp"
android:layout_weight="0.25"
android:background="#FF746C6C"
android:text="6"
android:textColor="#FFFFFFFF"
android:textSize="60sp" >
</Button>
<Button
android:id="@+id/btnNhan"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="2sp"
android:layout_weight="0.25"
android:background="#FF252222"
android:text="×"
android:textColor="#FFFFFFFF"
android:textSize="40sp" >
</Button>
</TableRow>
<!-- 123 -->
<TableRow
android:id="@+id/tableRow3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="2sp"
android:layout_weight="0.250" >
<Button
android:id="@+id/btnNumber1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="2sp"
android:layout_weight="0.25"
android:background="#FF746C6C"
android:text="1"
android:textColor="#FFFFFFFF"
android:textSize="60sp" >
</Button>
<Button
android:id="@+id/btnNumber2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="2sp"
android:layout_weight="0.25"
android:background="#FF746C6C"
android:text="2"
android:textColor="#FFFFFFFF"
android:textSize="60sp" >
</Button>
<Button
android:id="@+id/btnNumber3"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="2sp"
android:layout_weight="0.25"
android:background="#FF746C6C"
android:text="3"
android:textColor="#FFFFFFFF"
android:textSize="60sp" >
</Button>
<Button
android:id="@+id/btnTru"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="2sp"
android:layout_weight="0.25"
android:background="#FF252222"
android:text="-"
android:textColor="#FFFFFFFF"
android:textSize="40sp" >
</Button>
</TableRow>
<!-- . 0 = -->
<TableRow
android:id="@+id/tableRow4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="2sp"
android:layout_marginTop="2sp"
android:layout_weight="0.250" >
<Button
android:id="@+id/btnCham"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="2sp"
android:layout_weight="0.25"
android:background="#FF746C6C"
android:text="."
android:textColor="#FFFFFFFF"
android:textSize="60sp" >
</Button>
<Button
android:id="@+id/btnNumber0"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="2sp"
android:layout_weight="0.25"
android:background="#FF746C6C"
android:text="0"
android:textColor="#FFFFFFFF"
android:textSize="60sp" >
</Button>
<Button
android:id="@+id/btnBang"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="2sp"
android:layout_weight="0.25"
android:background="#FF252222"
android:text="="
android:textColor="#FFFFFFFF"
android:textSize="60sp" >
</Button>
<Button
android:id="@+id/btnCong"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="2sp"
android:layout_weight="0.25"
android:background="#FF252222"
android:text="+"
android:textColor="#FFFFFFFF"
android:textSize="40sp" >
</Button>
</TableRow>
</TableLayout>
</TableLayout>





 





 
 
 
 
0 nhận xét:
Đăng nhận xét