Android实现计算器布局(表格布局)_接下来我们通过表格布局tablelayout来搭建一个计算器界面,界面效果如下图所示

作者：小小林熬夜学编程 | 2024-04-16 04:45:12

踩

接下来我们通过表格布局tablelayout来搭建一个计算器界面,界面效果如下图所示

一:表格布局(TableLayout )

在这里插入图片描述

二:表格布局属性

在这里插入图片描述

三:效果图

在这里插入图片描述

四:样式(Values下的styles.xml)

<style name="ButtonStyle" >
        <item name="android:radius">10dp</item>
        <item name="android:textStyle">bold</item>
        <item name="android:textSize">20sp</item>
        <item name="android:color">#000</item>
        <item name="android:borderlessButtonStyle">@style/TextAppearance.AppCompat.Body1</item>
    </style>
1
2
3
4
5
6
7

五:布局代码

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <EditText
        android:gravity="right"
        android:paddingTop="130dp"
        android:textSize="100sp"
        android:layout_height="250dp"
        android:layout_width="match_parent"
        android:hint="0"/>
   <TableRow>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="C"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="←"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="%"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="÷"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
    </TableRow>
    <TableRow>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="7"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="8"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="9"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="x"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
    </TableRow>
    <TableRow>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="4"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="5"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="6"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="-"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
    </TableRow>
    <TableRow>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="1"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="2"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="3"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            android:text="+"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
    </TableRow>
    <TableRow>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="0"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="."
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="="
           android:layout_span="2"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
    </TableRow>
</TableLayout>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136

2022年3月18日修改:
运行在夜神模拟器上TableRow的内容没有居中对齐(通过在TableRow中添加layout_gravity=“center” android:gravity="center"得以解决!):

<?xml version="1.0" encoding="utf-8"?>
<TableLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_gravity="center"
    android:gravity="center"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <EditText
        android:gravity="right"
        android:paddingTop="130dp"
        android:textSize="100sp"
        android:layout_height="250dp"
        android:layout_width="match_parent"
        android:hint="0"/>
    <TableRow android:layout_gravity="center" android:gravity="center">

        <Button
            style="@style/ButtonStyle"
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:layout_marginLeft="0dp"
            android:text="C" />
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="←"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="%"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="÷"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
    </TableRow>
    <TableRow  android:layout_gravity="center" android:gravity="center">

        <Button
            style="@style/ButtonStyle"
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:layout_marginLeft="0dp"
            android:text="7" />
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="8"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="9"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="x"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
    </TableRow>
    <TableRow android:layout_gravity="center" android:gravity="center">

        <Button
            style="@style/ButtonStyle"
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:layout_marginLeft="0dp"
            android:text="4" />
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="5"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="6"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="-"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
    </TableRow>
    <TableRow android:layout_gravity="center" android:gravity="center">

        <Button
            style="@style/ButtonStyle"
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:layout_marginLeft="0dp"
            android:text="1" />
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="2"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="3"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            android:text="+"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
    </TableRow>
    <TableRow android:layout_gravity="center" android:gravity="center">

        <Button
            style="@style/ButtonStyle"
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:layout_marginLeft="0dp"
            android:text="0" />
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="."
            android:layout_height="90dp"
            android:layout_width="90dp"/>
        <Button
            android:layout_marginLeft="10dp"
            style="@style/ButtonStyle"
            android:text="="
            android:layout_span="2"
            android:layout_height="90dp"
            android:layout_width="90dp"/>
    </TableRow>
</TableLayout>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145

相关学习链接:
菜鸟编程网表格布局教程链接

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/小小林熬夜学编程/article/detail/432420