本文介绍了一款简易计算器的设计过程，包括前端界面布局与后端逻辑实现。前端使用Android平台的EditText和Button组件，通过自定义样式实现美观的界面效果。后端逻辑通过监听按钮点击事件并解析屏幕上的数学表达式来实现基本的算术运算。
前端知识点
1.<EditText
可以输入的文本框
2.线性布局 layout_width或layout_height其中一个为0dp，另一个为match_parent当是vertical排布的时候，一般都是layout_width为match_parent，layout_height=0dp,
horizontal为相反的属性。
3.改变文本框颜色，边框可以在drawable里面创建一个xml文件，<shape/>里面有<conners android:radius=" dp"/>让文本框圆润起来。<solid android:color="@android:color/white"/>
<stroke android:width="1dp"边框宽度
android :color="@android :color/black"/>
4.让点击计算器按钮时变颜色，可以在drawable中创建一个xlm文件<select/> <item android :"@drawable/ " android:state_pressed="true"/>按钮按下时会是什么颜色
<item android:drawable="@drawable/ "默认是什么颜色
5.当完成我们所需要的画板时在每一个按钮中加 android:background="@drawable/所需要的画板"
6.android： padding（right left blow bottom）按钮中字体的布局
ashend.xlm
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="5dp"/>
<solid android:color="#22000000"/>
</shape>gray_bg
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="5dp"/>
<solid android:color="@android:color/darker_gray"/>
</shape>orange_bg
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="5dp"/>
<solid android:color="@android:color/holo_orange_dark"/>
</shape>orange_select
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/ashend" android:state_pressed="true"/>
<item android:drawable="@drawable/orange_bg"/>
</selector>white_bg
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="5dp"/>
<solid
android:color="@android:color/white"
/>
<stroke
android:width="1dp"
android:color="@android:color/black"/>
</shape>white_select
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/ashend" android:state_pressed="true"/>
<item android:drawable="@drawable/white_bg" />
</selector>计算器的布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical"
tools:context="com.example.wuzuo.jsq.MainActivity">
<EditText
android:layout_width="fill_parent"
android:layout_height="80dp"
android:background="@drawable/white_bg"
android:gravity="bottom|right"
android:textSize="40dp"
android:id="@+id/et_input"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="vertical"
android:layout_weight="3">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal">
<Button
android:layout_width="60dp"
android:layout_height="match_parent"
android:textSize="30sp"
android:layout_weight="1"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:background="@drawable/white_select"
android:gravity="bottom|right"
android:text="C"
android:id="@+id/button1" />
<Button
android:layout_width="60dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:textSize="30sp"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:background="@drawable/white_select"
android:gravity="bottom|right"
android:text="DEL"
android:id="@+id/button2" />
<Button
android:layout_width="60dp"
android:layout_height="match_parent"
android:gravity="bottom|right"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:background="@drawable/white_select"
android:textSize="30sp"
android:layout_weight="1"
android:text="÷"
android:id="@+id/button3" />
<Button
android:layout_width="60dp"
android:layout_height="match_parent"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:background="@drawable/white_select"
android:gravity="bottom|right"
android:textSize="30sp"
android:layout_weight="1"
android:text="×"
android:id="@+id/button4" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal"
>
<Button
android:layout_width="60dp"
android:layout_height="match_parent"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:background="@drawable/white_select"
android:layout_weight="1"
android:gravity="bottom|right"
android:textSize="30sp"
android:text="7"
android:id="@+id/button5" />
<Button
android:layout_width="60dp"
android:layout_height="match_parent"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:background="@drawable/white_select"
android:layout_weight="1"
android:gravity="bottom|right"
android:textSize="30sp"
android:text="8"
android:id="@+id/button6" />
<Button
android:layout_width="60dp"
android:layout_height="match_parent"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:background="@drawable/white_select"
android:gravity="bottom|right"
android:layout_weight="1"
android:textSize="30sp"
android:text="9"
android:id="@+id/button7" />
<Button
android:layout_width="60dp"
android:layout_height="match_parent"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:background="@drawable/white_select"
android:gravity="bottom|right"
android:textSize="30sp"
android:layout_weight="1"
android:text="-"
android:id="@+id/button8" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal"
>
<Button
android:layout_width="60dp"
android:layout_height="match_parent"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:background="@drawable/white_select"
android:layout_weight="1"
android:gravity="bottom|right"
android:textSize="30sp"
android:text="4"
android:id="@+id/button9" />
<Button
android:layout_width="60dp"
android:layout_height="match_parent"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:background="@drawable/white_select"
android:layout_weight="1"
android:gravity="bottom|right"
android:textSize="30sp"
android:text="5"
android:id="@+id/button10" />
<Button
android:layout_width="60dp"
android:layout_height="match_parent"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:background="@drawable/white_select"
android:gravity="bottom|right"
android:textSize="30sp"
android:layout_weight="1"
android:text="6"
android:id="@+id/button11" />
<Button
android:layout_width="60dp"
android:layout_height="match_parent"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:background="@drawable/white_select"
android:gravity="bottom|right"
android:layout_weight="1"
android:textSize="30sp"
android:text="+"
android:id="@+id/button12" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2"
android:orientation="horizontal"
>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:gravity="bottom|right"
android:layout_weight="3"
android:orientation="vertical"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
>
<Button
android:layout_width="60dp"
android:layout_height="match_parent"
android:gravity="bottom|right"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:background="@drawable/white_select"
android:layout_weight="1"
android:id="@+id/button13"
android:textSize="30sp"
android:text="1"/>
<Button
android:layout_width="60dp"
android:layout_height="match_parent"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:background="@drawable/white_select"
android:text="2"
android:id="@+id/button14"
android:gravity="bottom|right"
android:textSize="30sp"
android:layout_weight="1"
/>
<Button
android:layout_width="60dp"
android:layout_height="match_parent"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:background="@drawable/white_select"
android:text="3"
android:gravity="bottom|right"
android:textSize="30sp"
android:id="@+id/button15"
android:layout_weight="1"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
>
<Button
android:layout_width="120dp"
android:layout_height="match_parent"
android:id="@+id/button16"
android:gravity="bottom|right"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:background="@drawable/white_select"
android:textSize="30sp"
android:text="0"
android:layout_weight="2"/>
<Button
android:layout_width="60dp"
android:layout_height="match_parent"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:background="@drawable/white_select"
android:gravity="bottom|right"
android:text="."
android:textSize="30dp"
android:layout_weight="1"
android:id="@+id/button17"/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
<Button
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/button18"
android:gravity="center"
android:paddingBottom="20dp"
android:paddingRight="30dp"
android:text="="
android:textSize="40sp"
android:background="@drawable/orange_select"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
后端
首先在MainActivity中对各个控件进行绑定控件实例化，以及设置监听事件，在这里我是使用实现接口的方式来实现监听事件事件，在控件数量比较多的情况下，这是一个不错的选择。
标点击事件Onclick()里用了一个switch（）结构用来识别究竟是点击了哪一个按钮，设置一个变量String str=rt_input.get().toString()来获取文本框里的输入信息，
对于case R. id. btn_0到case R.id.btn_point这些按钮，当我们获取到信息后就可以直接输出显示了et_input.setText(str+(Button)v).getText());对于case R.id.btn_plus等加减乘除这些控件，
为了和上面的数字按钮区别开来，我们多设置两个空格，下文会用的到，et_input.setText(str+“ ”+(Button)v).getText()+“ ”); 对于case R.id.btn_clean，
我们直接设置输出空值就好了et_input.setText（“”）；对于case R.id.btn_del,由于需要一个个字符删除，
我们添加一个条件if(str!-null&&!str.epual("")){}设置成et_input.setText (str.substring (0, str. length()-1));意思是比原来的文本内容少一个字符显示，
最后一个case R.id.equal是我们逻辑实现的关键部门，它就是实现运算的，所以我们需要另外写一个方法getResult()。
在关键部分getResult()中，首先是也是需要获取文本内容的String exp=rt_input.get().toString(),用于分离操作数和运算符。
然后我们按照几种输入情况分别处理：情况一：输入的值是空值或者没有，可以直接返回。
情况二：文本内容中没有包含“ ”空格符，这是我们上文提到的空格符，和我们运算符绑定在一起了，这是因为没有检测到空格符，也就是没有输入运算符，只输入的字符，也是直接返回。
情况三：输入的两个操作数都不为空(之所以成为“简易计算器”就是因为......它只实现两个操作数之间的四则运算！哈哈)，从这里开始我们就要分离操作数和运算符了，采用substring(start,end)的方法分离，注意运算符前后还有空格需要考虑，我们这里将操作数s1和s2强制转换成double 类型。接着就是用if()结构对四则运算分别处理了，该加的加，该减的就减。
最后再用一个if()结果，目的是如果两个操作数同时是int类型的，我们再把结果输出强制转换成int 类型。情况四：操作数s1非空，而s2是空值，就直接输出文本框中的内容。
情况五：S1是空值，S2不为空值，s2强制转换成double 类型，那么该加减的就加减，该乘除的就输出0，最后的输出也是要用一个if()结构判断一下的，如果是l两个操作数是double，就直接输出，如果是int ,就需要转换一下。
情况六：两个操作数都空，直接输出空et_input.setText("").
在进行完一次运算后，进行下一次运算，上次的结果还会停留在显示框不会清零，这里我们设置一个boolean值，在case的几种按钮中写上if (clear_flag) {clear_flag = false;str = "";et_input.setText(""); }就可以了！
package com.example.wuzuo.jsq;
import android.app.Activity;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
public class MainActivity extends Activity implements View.OnClickListener{
private Button bt_0;
private Button bt_1;
private Button bt_2;
private Button bt_3;
private Button bt_4;
private Button bt_5;
private Button bt_6;
private Button bt_7;
private Button bt_8;
private Button bt_9;
private Button bt_puls;
private Button bt_jian;
private Button bt_cheng;
private Button bt_chu;
private Button bt_equal;
private Button bt_c;
private Button bt_d;
private Button bt_point;
private EditText et_input;
boolean c_flag;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
bt_0= (Button) findViewById(R.id.button16);
bt_1= (Button) findViewById(R.id.button13);
bt_2= (Button) findViewById(R.id.button14);
bt_3= (Button) findViewById(R.id.button15);
bt_4= (Button) findViewById(R.id.button9);
bt_5= (Button) findViewById(R.id.button10);
bt_6= (Button) findViewById(R.id.button11);
bt_7= (Button) findViewById(R.id.button5);
bt_8= (Button) findViewById(R.id.button6);
bt_9= (Button) findViewById(R.id.button7);
bt_c= (Button) findViewById(R.id.button1);
bt_d= (Button) findViewById(R.id.button2);
bt_chu= (Button) findViewById(R.id.button3);
bt_cheng= (Button) findViewById(R.id.button4);
bt_jian= (Button) findViewById(R.id.button8);
bt_puls= (Button) findViewById(R.id.button12);
bt_equal= (Button) findViewById(R.id.button18);
bt_point= (Button) findViewById(R.id.button17);
et_input= (EditText) findViewById(R.id.et_input);
bt_0.setOnClickListener(this);
bt_1.setOnClickListener(this);
bt_2.setOnClickListener(this);
bt_3.setOnClickListener(this);
bt_4.setOnClickListener(this);
bt_5.setOnClickListener(this);
bt_6.setOnClickListener(this);
bt_7.setOnClickListener(this);
bt_8.setOnClickListener(this);
bt_9.setOnClickListener(this);
bt_puls.setOnClickListener(this);
bt_jian.setOnClickListener(this);
bt_cheng.setOnClickListener(this);
bt_chu.setOnClickListener(this);
bt_point.setOnClickListener(this);
bt_c.setOnClickListener(this);
bt_d.setOnClickListener(this);
bt_equal.setOnClickListener(this);
}
@Override
public void onClick(View v) {
String str=et_input.getText().toString();//取显示屏的内容
switch (v.getId())
{
case R.id.button5:
case R.id.button6:
case R.id.button7:
case R.id.button9:
case R.id.button10:
case R.id.button11:
case R.id.button13:
case R.id.button14:
case R.id.button15:
case R.id.button16:
case R.id.button17:
if(c_flag)
{
c_flag=false;
et_input.setText("");
str="";
}
et_input.setText(str+((Button)v).getText());//显示屏的内容,本来str代表着屏原本的内容，((Button)v).getText()代表按钮按了之后，会在屏幕上显示按钮代表的东西
break;
case R.id.button3:
case R.id.button4:
case R.id.button8:
case R.id.button12:
if(c_flag)
{
c_flag=false;
str="";
et_input.setText("");//每次运算完之后进行清空
}
et_input.setText(str + " " + ((Button) v).getText() + " ");//符号前后加空格
break;
case R.id.button1:
c_flag=false;
et_input.setText("");//屏幕上显示为空
break;
case R.id.button2:
if(c_flag)
{
c_flag=false;
str="";
et_input.setText("");
}
else if(str!=null&&!str.equals(""))
{
et_input.setText(str.substring(0,str.length()-1));//substring代表着截取字符串
}
break;
case R.id.button18:
getResult();
break;
}
}
private void getResult() {
String exp=et_input.getText().toString();//取显示屏里的数字
if(exp==null||exp.equals(""))
{
return;
}
if(!exp.contains(" "))
{
return ;
}
if(c_flag)
{
c_flag=false;
return;
}
c_flag=true;
double result=0;
String s1=exp.substring(0,exp.indexOf(" "));//indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。运算符前面的字符
String op=exp.substring(exp.indexOf(" ") + 1, exp.indexOf(" ") + 2);//运算符
String s2=exp.substring(exp.indexOf("") + 3);//运算符后面的字符
if(!s1.equals("")&&!s2.equals(""))
{
double d1=Double.parseDouble(s1);
double d2=Double.parseDouble(s2);
if(op.equals("+"))
{
result=d1+d2;
}else if (op.equals("-"))
{
result=d1-d2;
}
else if(op.equals("×"))
{
result=d1*d2;
}
else if(op.equals("÷"))
{
if(d2==0)
{
result=0;
}else
{
result= d1/d2;
}
}
if(!s1.contains(".")&&!s2.contains(".")&&!op.equals("÷"))
{
int r=(int)result;
et_input.setText(r+"");
}else
{
et_input.setText(result+"");
}
}
else if(s1.contains("")&&!s2.contains(""))
{
et_input.setText(exp);
}
else if(!s1.contains("")&&s2.contains(""))
{
double d2=Double.parseDouble(s2);
if(op.equals("+"))
{
result=0+d2;
}else if (op.equals("-"))
{
result=0-d2;
}
else if(op.equals("×"))
{
result=0;
}
else if(op.equals("÷"))
{
result=0;
} if(!s1.contains(".")&&!s2.contains(".")&&!op.equals("÷"))
{
int r=(int)result;
et_input.setText(r+"");
}else
{
et_input.setText(result+"");
}
}
else
{
et_input.setText("");
}
}
}
扫一扫
704
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
