We
will try to develop the simplest calculator, which takes two numbers and
applies addition, subtraction, multiplication and division operations to them.
The result is displayed as a complete expression.
Let’s
create an project:
Project name: P0191_SimpleCalculator
Build Target: Android 2.3.3
Application name: SimpleCalculator
Package name: com.brainbitz.simplecalculator
Create Activity: MainActivity
Build Target: Android 2.3.3
Application name: SimpleCalculator
Package name: com.brainbitz.simplecalculator
Create Activity: MainActivity
Open main.xml and draw the screen:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/linearLayout1"
android:layout_marginLeft="10pt"
android:layout_marginRight="10pt"
android:layout_marginTop="3pt">
<EditText
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_marginRight="5pt"
android:id="@+id/etNum1"
android:layout_width="match_parent"
android:inputType="numberDecimal">
</EditText>
<EditText
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginLeft="5pt"
android:id="@+id/etNum2"
android:layout_width="match_parent"
android:inputType="numberDecimal">
</EditText>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/linearLayout2"
android:layout_marginTop="3pt"
android:layout_marginLeft="5pt"
android:layout_marginRight="5pt">
<Button
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_weight="1"
android:text="+"
android:textSize="8pt"
android:id="@+id/btnAdd">
</Button>
<Button
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_weight="1"
android:text="-"
android:textSize="8pt"
android:id="@+id/btnSub">
</Button>
<Button
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_weight="1"
android:text="*"
android:textSize="8pt"
android:id="@+id/btnMult">
</Button>
<Button
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_weight="1"
android:text="/"
android:textSize="8pt"
android:id="@+id/btnDiv">
</Button>
</LinearLayout>
<TextView
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_marginLeft="5pt"
android:layout_marginRight="5pt"
android:textSize="12pt"
android:layout_marginTop="3pt"
android:id="@+id/tvResult"
android:gravity="center_horizontal">
</TextView>
</LinearLayout>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/linearLayout1"
android:layout_marginLeft="10pt"
android:layout_marginRight="10pt"
android:layout_marginTop="3pt">
<EditText
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_marginRight="5pt"
android:id="@+id/etNum1"
android:layout_width="match_parent"
android:inputType="numberDecimal">
</EditText>
<EditText
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginLeft="5pt"
android:id="@+id/etNum2"
android:layout_width="match_parent"
android:inputType="numberDecimal">
</EditText>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/linearLayout2"
android:layout_marginTop="3pt"
android:layout_marginLeft="5pt"
android:layout_marginRight="5pt">
<Button
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_weight="1"
android:text="+"
android:textSize="8pt"
android:id="@+id/btnAdd">
</Button>
<Button
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_weight="1"
android:text="-"
android:textSize="8pt"
android:id="@+id/btnSub">
</Button>
<Button
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_weight="1"
android:text="*"
android:textSize="8pt"
android:id="@+id/btnMult">
</Button>
<Button
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_weight="1"
android:text="/"
android:textSize="8pt"
android:id="@+id/btnDiv">
</Button>
</LinearLayout>
<TextView
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_marginLeft="5pt"
android:layout_marginRight="5pt"
android:textSize="12pt"
android:layout_marginTop="3pt"
android:id="@+id/tvResult"
android:gravity="center_horizontal">
</TextView>
</LinearLayout>
We
have two input fields here, four
buttons and a text field for
output.
Have a look at inputType attribute
for EditText. It defines the type
of the content.
I’ve specifiednumberDecimal - that is field can
only contain numbers and a dot, it will not allow
letters. It is convenient as you don’t have to code any checkings.
For
the TextView gravity attribute
is specified. It defines how will the text in
the TextView will be located. Don’t confuse it
with layout_gravity which is responsible for TextView location in a ViewGroup.
Now
we need to read field contents, define which buttons has been pressed and output
the needed result. Open MainActivity.java and
write the code:
public class MainActivity extends Activity implements OnClickListener {
EditText etNum1;
EditText etNum2;
Button btnAdd;
Button btnSub;
Button btnMult;
Button btnDiv;
TextView tvResult;
String oper = "";
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// find the elements
etNum1 = (EditText) findViewById(R.id.etNum1);
etNum2 = (EditText) findViewById(R.id.etNum2);
btnAdd = (Button) findViewById(R.id.btnAdd);
btnSub = (Button) findViewById(R.id.btnSub);
btnMult = (Button) findViewById(R.id.btnMult);
btnDiv = (Button) findViewById(R.id.btnDiv);
tvResult = (TextView) findViewById(R.id.tvResult);
// set a listener
btnAdd.setOnClickListener(this);
btnSub.setOnClickListener(this);
btnMult.setOnClickListener(this);
btnDiv.setOnClickListener(this);
}
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
float num1 = 0;
float num2 = 0;
float result = 0;
// check if the fields are empty
if (TextUtils.isEmpty(etNum1.getText().toString())
|| TextUtils.isEmpty(etNum2.getText().toString())) {
return;
}
// read EditText and fill variables with numbers
num1 = Float.parseFloat(etNum1.getText().toString());
num2 = Float.parseFloat(etNum2.getText().toString());
// defines the button that has been clicked and performs the corresponding operation
// write operation into oper, we will use it later for output
switch (v.getId()) {
case R.id.btnAdd:
oper = "+";
result = num1 + num2;
break;
case R.id.btnSub:
oper = "-";
result = num1 - num2;
break;
case R.id.btnMult:
oper = "*";
result = num1 * num2;
break;
case R.id.btnDiv:
oper = "/";
result = num1 / num2;
break;
default:
break;
}
// form the output line
tvResult.setText(num1 + " " + oper + " " + num2 + " = " + result);
}
}
EditText etNum1;
EditText etNum2;
Button btnAdd;
Button btnSub;
Button btnMult;
Button btnDiv;
TextView tvResult;
String oper = "";
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// find the elements
etNum1 = (EditText) findViewById(R.id.etNum1);
etNum2 = (EditText) findViewById(R.id.etNum2);
btnAdd = (Button) findViewById(R.id.btnAdd);
btnSub = (Button) findViewById(R.id.btnSub);
btnMult = (Button) findViewById(R.id.btnMult);
btnDiv = (Button) findViewById(R.id.btnDiv);
tvResult = (TextView) findViewById(R.id.tvResult);
// set a listener
btnAdd.setOnClickListener(this);
btnSub.setOnClickListener(this);
btnMult.setOnClickListener(this);
btnDiv.setOnClickListener(this);
}
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
float num1 = 0;
float num2 = 0;
float result = 0;
// check if the fields are empty
if (TextUtils.isEmpty(etNum1.getText().toString())
|| TextUtils.isEmpty(etNum2.getText().toString())) {
return;
}
// read EditText and fill variables with numbers
num1 = Float.parseFloat(etNum1.getText().toString());
num2 = Float.parseFloat(etNum2.getText().toString());
// defines the button that has been clicked and performs the corresponding operation
// write operation into oper, we will use it later for output
switch (v.getId()) {
case R.id.btnAdd:
oper = "+";
result = num1 + num2;
break;
case R.id.btnSub:
oper = "-";
result = num1 - num2;
break;
case R.id.btnMult:
oper = "*";
result = num1 * num2;
break;
case R.id.btnDiv:
oper = "/";
result = num1 / num2;
break;
default:
break;
}
// form the output line
tvResult.setText(num1 + " " + oper + " " + num2 + " = " + result);
}
}
I guess everything is clear in
comments. Read values, define the button, perform an operation and output to
the text field. Activity is a listener of the clicked buttons.
Save
everything and run.
Let’s extend the functionality by making menu with clearing fields and exit items. Items will be
named Reset and Quit.
Add two constants - these will be IDs of the menu items.
public class MainActivity extends Activity implements OnClickListener {
final int MENU_RESET_ID = 1;
final int MENU_QUIT_ID = 2;
EditText etNum1;
final int MENU_RESET_ID = 1;
final int MENU_QUIT_ID = 2;
EditText etNum1;
(add only the underlined code)
And
write code for menu creation and processing:
// menu creation
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// TODO Auto-generated method stub
menu.add(0, MENU_RESET_ID, 0, "Reset");
menu.add(0, MENU_QUIT_ID, 0, "Quit");
return super.onCreateOptionsMenu(menu);
}
// process menu item clicks
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// TODO Auto-generated method stub
switch (item.getItemId()) {
case MENU_RESET_ID:
// clear the fields
etNum1.setText("");
etNum2.setText("");
tvResult.setText("");
break;
case MENU_QUIT_ID:
// exit the application
finish();
break;
}
return super.onOptionsItemSelected(item);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// TODO Auto-generated method stub
menu.add(0, MENU_RESET_ID, 0, "Reset");
menu.add(0, MENU_QUIT_ID, 0, "Quit");
return super.onCreateOptionsMenu(menu);
}
// process menu item clicks
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// TODO Auto-generated method stub
switch (item.getItemId()) {
case MENU_RESET_ID:
// clear the fields
etNum1.setText("");
etNum2.setText("");
tvResult.setText("");
break;
case MENU_QUIT_ID:
// exit the application
finish();
break;
}
return super.onOptionsItemSelected(item);
}
Save
everything and run. Two menu items appeared:
Reset - clears all the fields
Quit - closes the application
Quit - closes the application
As
your homework you can implement division by zero
checking.
And output a message using Toast or right into the result field.
No comments:
Post a Comment