Android-数字展示

一个粉红色的Android 数字展示界面设计

先看看粉红色的效果图

代码

1.sytle代码

<style name="TextViewStyle">
    <item name="android:layout_width">80dp</item>
    <item name="android:layout_height">80dp</item>
    <item name="android:textColor">@color/white</item>
    <item name="android:gravity">center</item>
    <item name="android:layout_weight">1</item>
    <item name="android:textSize">25sp</item>
    <item name="android:clickable">true</item>
    <item name="android:background">@drawable/selector_view_pressed_gray_bg</item>
</style>

background xml文件代码

 <?xml version="1.0" encoding="utf-8"?>
  <selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:drawable="@color/gray_q" android:state_pressed="true" />
  <!--按下的颜色-->
  <item android:drawable="@color/pink"/>
  <!--正常的颜色-->
</selector>

主布局文件

 <?xml version="1.0" encoding="utf-8"?>
<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:background="@color/pink"
android:orientation="vertical">
<TextView
    android:id="@+id/tv_top_pwd"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:maxLength="10"
    android:paddingTop="80dp"
    android:text=""
    android:textColor="@color/white"
    android:textSize="25sp" />
<include layout="@layout/nine_layout"/>
</LinearLayout>

include layout xml

<?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">

<TableLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginTop="2dp"
    android:gravity="center">

    <TableRow>

        <TextView
            android:id="@+id/tv_1"
            style="@style/TextViewStyle"
            android:text="1" />

        <TextView
            android:id="@+id/tv_2"
            style="@style/TextViewStyle"
            android:text="2" />

        <TextView
            android:id="@+id/tv_3"
            style="@style/TextViewStyle"
            android:text="3" />
    </TableRow>

    <TableRow>

        <TextView
            android:id="@+id/tv_4"
            style="@style/TextViewStyle"
            android:text="4" />

        <TextView
            android:id="@+id/tv_5"
            style="@style/TextViewStyle"
            android:text="5" />

        <TextView
            android:id="@+id/tv_6"
            style="@style/TextViewStyle"
            android:text="6" />
    </TableRow>

    <TableRow>

        <TextView
            android:id="@+id/tv_7"
            style="@style/TextViewStyle"
            android:text="7" />

        <TextView
            android:id="@+id/tv_8"
            style="@style/TextViewStyle"
            android:text="8" />

        <TextView
            android:id="@+id/tv_9"
            style="@style/TextViewStyle"
            android:text="9" />
    </TableRow>

    <TableRow>

        <TextView
            android:id="@+id/tv_0"
            style="@style/TextViewStyle"
            android:text="0" />

        <TextView
            android:id="@+id/tv_dian"
            style="@style/TextViewStyle"
            android:text="." />

        <TextView
            android:id="@+id/tv_commit"
            style="@style/TextViewStyle"
            android:text="↩" />
    </TableRow>
</TableLayout>
</LinearLayout>

解释一波Android xml的属性

当中用到的父布局:

1.LinearLayout 线性布局 分为横行和纵向
2.TableLayout 表格布局

当中用到的View:

1.TextView 标签文本
2.TableRow 表格行

不懂的问我，这是基本操作~