第一个Android实例——计算器

学习Android已经有一段时间了，最近一直在啃书，感觉挺充实的~好期待放假，这样可以快点把书看完自己去多做点实例项目，加深理解。

这是之前写的一个计算器小程序，比较简单，但是是自己第一个用Android写出来的小程序，值得纪念噢~

计算器实例

第一部分：计算器布局设计

       首选需要new一个Android项目，然后修改界面布局，代码如下

 

<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"
    android:background="#111"
    tools:context="com.example.jisuanqi.MainActivity" >

    <TextView
        android:id="@+id/tv"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#fff"
        android:gravity="right"
        android:layout_margin="5dp"
         />

    <TableLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="wrap_content" >

            <Button
                android:id="@+id/btn1"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="1" />

            <Button
                android:id="@+id/btn2"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="2" />

            <Button
                android:id="@+id/btn3"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="3" />

            <Button
                android:id="@+id/btnjia"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="+" />
        </TableRow>

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="wrap_content" >

            <Button
                android:id="@+id/btn4"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="4" />

            <Button
                android:id="@+id/btn5"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="5" />

            <Button
                android:id="@+id/btn6"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="6" />

            <Button
                android:id="@+id/btnjian"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="-" />
        </TableRow>

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="wrap_content" >

            <Button
                android:id="@+id/btn7"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="7" />

            <Button
                android:id="@+id/btn8"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="8" />

            <Button
                android:id="@+id/btn9"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="9" />

            <Button
                android:id="@+id/btncheng"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="*" />
        </TableRow>

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="wrap_content" >

            <Button
                android:id="@+id/btnclean"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="C" />

            <Button
                android:id="@+id/btn0"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="0" />

            <Button
                android:id="@+id/btndengyu"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="=" />

            <Button
                android:id="@+id/btnchu"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="/" />
        </TableRow>
    </TableLayout>

</LinearLayout>

 

 

 预览效果：

虽然看起来还比较硕，但是起码有个样子了...(*^__^*) 
 

 

第二部分：计算器功能实现

首先需要在主activity中注册组件

 

public class MainActivity extends Activity implements OnClickListener {

	private TextView tvScreen ;
	private List<Item> items = new ArrayList<Item>();

这里引入OnclickListener接口 是在后面绑定按钮设置监听器

 

然后重写onCreate方法，把布局中的按钮以及textview绑定

 

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		tvScreen = (TextView) findViewById(R.id.tv);
		findViewById(R.id.btn0).setOnClickListener(this);
		findViewById(R.id.btn1).setOnClickListener(this);
		findViewById(R.id.btn2).setOnClickListener(this);
		findViewById(R.id.btn3).setOnClickListener(this);
		findViewById(R.id.btn4).setOnClickListener(this);
		findViewById(R.id.btn5).setOnClickListener(this);
		findViewById(R.id.btn6).setOnClickListener(this);
		findViewById(R.id.btn7).setOnClickListener(this);
		findViewById(R.id.btn8).setOnClickListener(this);
		findViewById(R.id.btn9).setOnClickListener(this);
		findViewById(R.id.btnjia).setOnClickListener(this);
		findViewById(R.id.btnjian).setOnClickListener(this);
		findViewById(R.id.btncheng).setOnClickListener(this);
		findViewById(R.id.btnchu).setOnClickListener(this);
		findViewById(R.id.btndengyu).setOnClickListener(this);
		findViewById(R.id.btnclean).setOnClickListener(this);
		findViewById(R.id.btn0).setOnClickListener(this);
	
		
	}

 到了这一步，得理清一下算法逻辑。

 

 

我们首先得输入一个数字，然后输入运算符号，再输入数字，再执行=号

10+20

 

一个数字一个操作符号一个数字一个操作符号这样排列

10+20=38

 

在执行第二个操作符号时前面三项已经可以执行运算了

所以这里需要一个原则：一旦能执行操作运算就执行操作运算，之后再与后面的元素执行相关操作

 

所以这里可以用数组把这些项都记录下来，然后再做一个判断，判断前面三项是否有三项，就可以执行运算，如果是就执行运算并继续到下一个。

 

所以接下来再创建一个类Item.java（注意这个类和Mainactivity在一个包里）表示每一项

package com.example.jisuanqi;

public class Item {
	
	public Item(double value, int type) {
		this.value = value;
		this.type = type;
	}
	
	public double value = 0;
	
	public int type = 0;
}

 以及另一个类表示数据类型Types.java

package com.example.jisuanqi;

public class Types {

	public static final int jia = 1;

	public static final int jian = 2;
	
	public static final int cheng = 3;

	public static final int chu = 4;

	public static final int dengyu = 5;
}

 再回到mainactivity里定义一个数组，这个数组是用来存放项的，也就是计算时输入的项。

public class MainActivity extends Activity implements OnClickListener {

	private TextView tvScreen ;
	private List<Item> items = new ArrayList<Item>();

 然后在onclick（）方法中作判断，分别执行不同的操作。

public void onClick(View v) {
		switch (v.getId()) {
		case R.id.btn0:
			tvScreen.append("0");
			break;
		case R.id.btn1:
			tvScreen.append("1");
			break;
		case R.id.btn2:
			tvScreen.append("2");
			break;
		case R.id.btn3:
			tvScreen.append("3");
			break;
		case R.id.btn4:
			tvScreen.append("4");
			break;
		case R.id.btn5:
			tvScreen.append("5");
			break;
		case R.id.btn6:
			tvScreen.append("6");
			break;
		case R.id.btn7:
			tvScreen.append("7");
			break;
		case R.id.btn8:
			tvScreen.append("8");
			break;
		case R.id.btn9:
			tvScreen.append("9");
			break;
		case R.id.btnjia:
			items.add(new Item(Double.parseDouble(tvScreen.getText().toString()),Types.dengyu));
			checkAndCompute();
			items.add(new Item(0, Types.jia));
			tvScreen.setText("");
			break;
		case R.id.btnjian:
			items.add(new Item(Double.parseDouble(tvScreen.getText().toString()),Types.dengyu));
			checkAndCompute();
			items.add(new Item(0, Types.jian));
			tvScreen.setText("");
			break;
		case R.id.btncheng:
			items.add(new Item(Double.parseDouble(tvScreen.getText().toString()),Types.dengyu));
			checkAndCompute();
			items.add(new Item(0, Types.cheng));
			tvScreen.setText("");
			break;
		case R.id.btnchu:
			items.add(new Item(Double.parseDouble(tvScreen.getText().toString()),Types.dengyu));
			checkAndCompute();
			items.add(new Item(0, Types.chu));
			tvScreen.setText("");
			break;
		case R.id.btnclean:
			tvScreen.setText("");
			items.clear();
			break;
		case R.id.btndengyu:
			items.add(new Item(Double.parseDouble(tvScreen.getText().toString()),Types.dengyu));
			checkAndCompute();
			tvScreen.setText(items.get(0).value+"");
			items.clear();
			break;

		default:
			break;
		}
	}

 注意这里还需要一个方法进行计算

 

	public void checkAndCompute() {
		if (items.size()>=3) {
			double a = items.get(0).value;
			double b = items.get(2).value;
			int opt = items.get(1).type;
			
			items.clear();
			
			switch (opt) {
			case Types.jia:
				items.add(new Item(a+b, Types.dengyu));
				break;
			case Types.jian:
				items.add(new Item(a-b, Types.dengyu));
				break;
			case Types.cheng:
				items.add(new Item(a*b, Types.dengyu));
				break;
			case Types.chu:
				items.add(new Item(a/b, Types.dengyu));
				break;

			default:
				break;
			}
			
		}
	}

 

 

这样一来，计算器功能就已经实现了，下面是虚拟机上的运行效果图：

操作：6+3=9

 

 

 

 

ps：写完之后发现其实还是有很多缺陷的。。比如没有小数点.，不过把左下方C的按钮换成“.”，然后再到下方加一个专门的clean按钮就可以了~

************************************************华丽的分割线******************************************************************

今天把计算器界面还有功能优化了一下，加入了小数点功能，下方加入了清屏按钮

新增了一个显示框，可以显示算法的步骤。

还加入了按钮选择状态和非选择状态颜色显示不同的功能

其实这个功能并不复杂，在res目录下新建一个drawable文件夹

然后在里面新建xml文件login_button_selector.xml类型为selector

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:drawable="@drawable/clr_normal" android:state_pressed="false"/>
        <item android:drawable="@drawable/clr_pressed" android:state_pressed="true"/>
    </selector>

 然后在按钮布局中添加一句

android:background="@drawable/login_button_selector"

 就ok~\(≧▽≦)/~啦啦啦

下面是运行效果截图：

 

 

最后就是整个项目的附件：

..试了几次不能上传，所以传到百度云了，下面是链接：

http://yun.baidu.com/share/link?shareid=4106246580&uk=4047395201
 

评论

8 楼 Donshion 2015-10-27  

楼主,代码能否以附件上传,共同学习?

7 楼 南瓜猿 2015-09-24  

511039003 写道

楼主,你是在啃那本书呀?说不定我们在啃同一本书

我看的是《第一行代码》
我上传的是项目你可以用eclipse导入之后再到手机上运行

6 楼 511039003 2015-09-24  

楼主,你这个应用可以直接安装到我的android手机吗?我想安装在我的手机上看看效果

5 楼 511039003 2015-09-24  

楼主,你是在啃那本书呀?说不定我们在啃同一本书

4 楼 南瓜猿 2015-09-23  

BS_YG 写道

楼主计算器AI可以展示下吗？

已经在里面了

3 楼 南瓜猿 2015-09-23  

511039003 写道

楼主,代码能否以附件上传,共同学习?

恩我等下再编辑一次

2 楼 511039003 2015-09-23  

楼主,代码能否以附件上传,共同学习?

1 楼 BS_YG 2015-09-22  

楼主计算器AI可以展示下吗？