You are on page 1of 24

UNIT 4 : Designing User Interface with View

Text View/Edit Text/Image button/Autocompletetextview/Toggle Button/


MainActivity.Java
package com.example.project1;
import androidx.appcompat.app.AppCompatActivity;
import android.graphics.Color;
import android.os.Bundle;
import android.view.View;
import android.widget.ArrayAdapter;
import android.widget.AutoCompleteTextView;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;
import android.widget.Toast;
import android.widget.ToggleButton;

public class MainActivity extends AppCompatActivity {

String[] str={"Amravati,india","Akola,India","Amnsv,India"};

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
TextView TEXT1 =(TextView) findViewById(R.id.textview1);
Button btn1=(Button) findViewById(R.id.bt2);
EditText edt=(EditText) findViewById(R.id.edit6);
ToggleButton tg3=(ToggleButton) findViewById(R.id.tgl2);
ToggleButton tg4=(ToggleButton) findViewById(R.id.tgl1);
AutoCompleteTextView auto2=(AutoCompleteTextView) findViewById(R.id.auto1);
TEXT1.setText("Naina");
TEXT1.setTextSize(60);
TEXT1.setTextColor(Color.parseColor("#FF000000"));
ArrayAdapter adapter= new ArrayAdapter(getApplicationContext(),
android.R.layout.select_dialog_item,str);
auto2.setAdapter(adapter);
StringBuffer buffer=new StringBuffer();
buffer.append("first toggles button state ").append(tg3.getText().toString());
buffer.append( "\n second toggles button state ").append(tg4.getText().toString());

btn1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
String msg= auto2.getText().toString();
Toast.makeText(getApplicationContext(),buffer,Toast.LENGTH_SHORT).show();
}
});

}
}

activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
tools:context=".MainActivity">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/textview1"
android:textSize="30sp"
android:layout_centerHorizontal="true"
android:text="Naina" />

<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_below="@+id/textview1"
android:id="@+id/edit6"
android:textSize="30sp"
android:hint="enter your name"/>

<ImageButton
android:layout_width="70dp"
android:layout_height="80dp"
android:layout_centerHorizontal="true"
android:layout_below="@+id/edit6"
android:src="@drawable/ic_launcher_background"
android:layout_marginTop="30dp"
android:id="@+id/img3"/>

<ToggleButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tgl1"
android:layout_toStartOf="@+id/img3"
android:layout_below="@+id/img3"/>

<ToggleButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tgl2"
android:layout_toEndOf="@+id/img3"
android:layout_below="@+id/img3"
android:textOn="play"
android:textOff="pause"
android:clickable="true"/>

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/bt2"
android:layout_centerHorizontal="true"
android:layout_below="@+id/img3"
android:layout_marginTop="70dp"
android:text="click me"/>

<AutoCompleteTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/auto1"
android:layout_below="@+id/bt2"
android:layout_alignLeft="@+id/edit6"
android:layout_alignRight="@+id/edit6"
android:hint="places"
android:gravity="center"
android:completionThreshold="2"/>
</RelativeLayout>

OUTPUT:
Check Box
MainActivity.Java

package com.example.check_box;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.CheckBox;
import android.widget.ListView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {


@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

CheckBox chk1=(CheckBox) findViewById(R.id.checkbox1);


CheckBox chk2=(CheckBox) findViewById(R.id.checkbox2);
Button btn1=(Button) findViewById(R.id.button1);

// response 100% or 80% or 0% or 10%

btn1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
StringBuffer result= new StringBuffer();
result.append("first chechbox : ").append(chk1.isChecked()); //TRUE value output
result.append("\n Second checkbox :").append(chk2.isChecked()); // false value
output

String msg=result.toString();
Toast.makeText(getApplicationContext(), msg, Toast.LENGTH_LONG).show();
}
});
}
}

activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
tools:context=".MainActivity"
android:gravity="center" >

<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/checkbox1"
android:checked="true"
android:text="Male"
android:layout_centerHorizontal="true"
android:textSize="25sp"/>
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:id="@+id/checkbox2"
android:layout_below="@+id/checkbox1"
android:text="Female"
android:textSize="25sp"/>

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="CLICK ME"
android:id="@+id/button1"
android:layout_below="@+id/checkbox2"
android:layout_centerHorizontal="true"
android:layout_marginTop="30dp"
android:textSize="25sp"/>

</RelativeLayout>
Output:

ListView
MainActivity.java
package com.example.List_view;

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
// import android.view.View;
import android.widget.ArrayAdapter;
public class MainActivity extends AppCompatActivity {

// _____JAVA ARRAY____
String[] item = {"MAD", "OS", "CSS", "DBMS", "Compiler design"};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

ListView list1=(ListView) findViewById(R.id.listview1);


// response 100% or 80% or 0% or 10%

ArrayAdapter adapter= new ArrayAdapter(getApplicationContext(),


android.R.layout.select_dialog_item, item);
// (Built in layout provide store suggestion list)
list1.setAdapter(adapter);
}
}

Activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
tools:context=".MainActivity"
android:gravity="center"
>

<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/listview1"
/>
</RelativeLayout>

Output:

Progress Bar
MainActivity.Java
package com.example.imagebutton;

import android.app.Activity;
import android.app.ProgressDialog;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
public class MainActivity extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

Button b1=(Button) findViewById(R.id.button2);

}
public void download(View view){
ProgressDialog progress=new ProgressDialog(this);
progress.setMessage("Download Music");
progress.setProgressStyle(ProgressDialog.STYLE_HORIZONTAL);
progress.setIndeterminate(false);
progress.setProgress(10);
progress.show();
final int totalProgressTime=200;
final Thread t=new Thread(){
@Override
public void run() {
int jumpTime=50;
while (jumpTime<totalProgressTime){
try{
sleep(200);
jumpTime=jumpTime+1;
progress.setProgress(jumpTime);
}
catch (InterruptedException e){
// TO-DO Autogenerated AI block
e.printStackTrace();
}
}
}
};
t.start();
}

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>


<RelativeLayout 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"
tools:context=".MainActivity">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/textview1"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:textSize="30dp"
android:text="Progress bar"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/textview2"
android:layout_below="@+id/textview1"
android:layout_centerHorizontal="true"
android:textSize="30dp"
android:textColor="#ff16ff01"
android:text="MAD"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Download"
android:onClick="download"
android:id="@+id/button2"
android:layout_alignLeft="@+id/textview1"
android:layout_centerVertical="true"/>

</RelativeLayout>

Output:
Custom_Toast
MainActivity.java
package com.example.custom_toast;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

// _______for simple toast________


Button btn1= (Button) findViewById(R.id.simplebutton);
Button btn2= (Button) findViewById(R.id.custombutton);

btn1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this, "Simple toast pop-up",
Toast.LENGTH_SHORT).show();

}
});

btn2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
LayoutInflater inflater = getLayoutInflater();

// ha-1 or na-2

// View layout = inflater.inflate(R.layout.toast_border,


// (ViewGroup) findViewById(R.id.toast_layout_root));
// (your mannully designed activity file named as custom toast is link to thye inflator
ny using R.layout.nmae of your file name )
View layout = inflater.inflate(R.layout.custom_toast,
(ViewGroup) findViewById(R.id.customtoast1));

ImageView toastimage= (ImageView) layout.findViewById(R.id.customimage);


TextView toastext= (TextView) layout.findViewById(R.id.customtext);

toastimage.setImageResource(R.drawable.iamge);
toastext.setText("This is your custom toast");

Toast toast= new Toast(getApplicationContext());


toast.setDuration(Toast.LENGTH_LONG);
toast.setView(layout);
toast.show();

}
});

//___________-Custome TOAST_________

//______inflator_________allow perticuler out view connect to the our activity

}
}

Activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
tools:context=".MainActivity">

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Simple"
android:textSize="25sp"
android:layout_centerHorizontal="true"
android:layout_marginTop="50dp"
android:id="@+id/simplebutton"
/>

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Custom"
android:textSize="25sp"
android:layout_centerHorizontal="true"
android:layout_marginTop="150dp"
android:id="@+id/custombutton"
/>

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="800dp"
android:layout_centerHorizontal="true"
android:text="Bottom"/>

</RelativeLayout>

Custom_toast.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"
android:padding="10dp"
android:background="#FF000000"
android:orientation="horizontal"
android:id="@+id/customtoast1">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:id="@+id/customimage"
android:src="@drawable/iamge"/>
<!-- android:src="@drawable/ic_launcher_foreground"/>-->

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/customtext"
android:textColor="#FFFFFFFF"
android:text="This is my custom Toast"/>
<!-- android:text="THIS IS CUSTOM TOAST"/>-->

</LinearLayout>

Output:
DATE_PICKER

MainActivity.Java

package com.example.date_picker;

import android.app.Activity;
import android.app.DatePickerDialog;
import android.os.Bundle;
import android.view.View;
import android.widget.DatePicker;
import android.widget.EditText;
import java.util.Calendar;
public class MainActivity extends Activity {

EditText date;
DatePickerDialog datePickerDialog;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// initiate the date picker and a button
date = (EditText) findViewById(R.id.date);
// perform click event on edit text
date.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// calender class's instance and get current date , month and year from calender
Calendar c = Calendar.getInstance();
int mYear = c.get(Calendar.YEAR); // current year
int mMonth = c.get(Calendar.MONTH); // current month
int mDay = c.get(Calendar.DAY_OF_MONTH); // current day
// date picker dialog
datePickerDialog = new DatePickerDialog(MainActivity.this, new
DatePickerDialog.OnDateSetListener() {
@Override
public void onDateSet(DatePicker view, int year, int month, int dayOfMonth) {
date.setText(dayOfMonth+"/"+month+"/"+ year);
}
}, mYear,mMonth,mDay);

datePickerDialog.show();
}
});

}
}

Activity_main.xml

<?xml version="1.0" encoding="utf-8"?>


<RelativeLayout 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"
tools:context=".MainActivity">

<EditText
android:id="@+id/date"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:background="#d4d4d4"
android:hint="Select Date..."
android:padding="15dp"
android:textColor="#897"
android:textColorHint="#090"
android:textSize="20sp"
android:textStyle="bold" />

</RelativeLayout>

Output:
TIME_PICKER

MainActivity.Java
package com.example.time_picker;
public class MainActivity extends Activity {

TextView time;
TimePicker simpleTimePicker;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// initiate the view's
time = (TextView) findViewById(R.id.time);
simpleTimePicker = (TimePicker) findViewById(R.id.simpleTimePicker);
simpleTimePicker.setIs24HourView(false); // used to display AM/PM mode
// perform set on time changed listener event
simpleTimePicker.setOnTimeChangedListener(new
TimePicker.OnTimeChangedListener() {
@Override
public void onTimeChanged(TimePicker view, int hourOfDay, int minute) {
// display a toast with changed values of time picker
Toast.makeText(getApplicationContext(), hourOfDay + " " + minute,
Toast.LENGTH_SHORT).show();
time.setText("Time is :: " + hourOfDay + " : " + minute); // set the current time in text
view
}
});
}

}
Activity_main.xml

<?xml version="1.0" encoding="utf-8"?>


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

tools:context=".MainActivity">

<TimePicker
android:id="@+id/simpleTimePicker"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="50dp"
android:padding="20dp"/>
<!-- android:timePickerMode="spinner" />-->
<!-- android:background="#090"-->

<TextView
android:id="@+id/time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="Time Is ::"
android:textColor="#090"
android:textSize="20sp"
android:textStyle="bold" />
</RelativeLayout>
Output:

You might also like