Android实现一个电话界面

最新推荐文章于 2019-03-04 11:42:32 发布

原创最新推荐文章于 2019-03-04 11:42:32 发布 · 1.3k 阅读

2 ·

CC 4.0 BY-SA版权

Android基础专栏收录该内容

33 篇文章

订阅专栏

本文介绍了一个具体的Android应用界面布局设计实例，使用了多种布局方式，包括LinearLayout、RelativeLayout和TableLayout等，展示了如何组织UI元素并实现良好的视觉效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这里写图片描述
效果图如上。

界面代码

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:app="http://schemas.android.com/apk/res-auto"
            xmlns:tools="http://schemas.android.com/tools"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              xmlns:app="http://schemas.android.com/apk/res-auto"
              xmlns:tools="http://schemas.android.com/tools"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:orientation="vertical">


    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="20dp">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:text="12"
            android:textColor="@color/black"
            android:textSize="20sp"/>

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:src="@drawable/phone_keyboard_backspace_normal"/>
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="20dp">

        <TextView
            android:id="@+id/name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:drawableRight="@drawable/active_small"
            android:text="没文化"
            android:textColor="@color/black"
            android:textSize="20sp"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/name"
            android:text="123434545"
            android:textSize="16sp"/>

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:src="@drawable/phone_keyboard_down_normal"/>
    </RelativeLayout>



</LinearLayout>
    <TableLayout
        android:layout_gravity="bottom"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:stretchColumns="*">

        <TableRow>

            <TextView
                android:gravity="center"
                android:paddingTop="40dp"
                android:text="1"
                android:textColor="@color/black"
                android:textSize="20sp"
                />

            <TextView
                android:gravity="center"
                android:paddingTop="40dp"
                android:text="2"
                android:textColor="@color/black"
                android:textSize="20sp"
                />

            <TextView
                android:gravity="center"
                android:paddingTop="40dp"
                android:text="3"
                android:textColor="@color/black"
                android:textSize="20sp"
                />
        </TableRow>

        <TableRow>

            <TextView
                android:gravity="center"
                android:paddingTop="40dp"
                android:text="4"
                android:textColor="@color/black"
                android:textSize="20sp"
                />

            <TextView
                android:gravity="center"
                android:paddingTop="40dp"
                android:text="5"
                android:textColor="@color/black"
                android:textSize="20sp"
                />

            <TextView
                android:gravity="center"
                android:paddingTop="40dp"
                android:text="6"
                android:textColor="@color/black"
                android:textSize="20sp"
                />
        </TableRow>

        <TableRow>

            <TextView
                android:gravity="center"
                android:paddingTop="40dp"
                android:text="7"
                android:textColor="@color/black"
                android:textSize="20sp"
                />

            <TextView
                android:gravity="center"
                android:paddingTop="40dp"
                android:text="8"
                android:textColor="@color/black"
                android:textSize="20sp"
                />

            <TextView
                android:gravity="center"
                android:paddingTop="40dp"
                android:text="9"
                android:textColor="@color/black"
                android:textSize="20sp"
                />
        </TableRow>
        <TableRow>


            <TextView
                android:gravity="center"
                android:paddingTop="40dp"
                android:layout_column="1"
                android:text="0"
                android:textColor="@color/black"
                android:textSize="20sp"
                />


        </TableRow>

        <ImageView
            android:paddingTop="30dp"
            android:src="@drawable/phone_keyboard_call_normal"/>
    </TableLayout>
</FrameLayout>