Android Sensor Programming CIS 694/EEC 693 Android Sensor Programming Lecture 7 Wenbing Zhao Department of Electrical Engineering and Computer Science Cleveland State University w.zhao1@csuohio.edu 10/31/2019 Android Sensor Programming

Android Sensor Programming User Interface ScrollView Adapting to Display Orientation Action Bar Creating UI Programmatically 10/31/2019 Android Sensor Programming

Android Sensor Programming ScrollView A ScrollView is a special type of FrameLayout in that it enables users to scroll through a list of views that occupy more space than the physical display The ScrollView can contain only one child view or ViewGroup, which normally is a LinearLayout 10/31/2019 Android Sensor Programming

Android Sensor Programming ScrollView <Button android:id="@+id/button3" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Button 3" /> <EditText android:id="@+id/txt" android:layout_height="600dp" /> android:id="@+id/button4" android:text="Button 4" /> android:id="@+id/button5" android:text="Button 5" /> </LinearLayout> </ScrollView> <ScrollView android:layout_width="fill_parent" android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android"> <LinearLayout android:layout_height="wrap_content" android:orientation="vertical" android:focusable="true" android:focusableInTouchMode="true"> <Button android:id="@+id/button1" android:text="Button 1" /> android:id="@+id/button2" android:text="Button 2" /> 10/31/2019 Android Sensor Programming

Android Sensor Programming ScrollView Scroll down to see this: 10/31/2019 Android Sensor Programming

Adapting to Display Orientation Two techniques to handle changes in screen orientation: Anchoring—The easiest way is to “anchor” your views to the four edges of the screen. When the screen orientation changes, the views can anchor neatly to the edges Resizing and repositioning—Resizing each and every view according to the current screen orientation 10/31/2019 Android Sensor Programming

Anchoring Views with RelativeLayout <Button android:id="@+id/button3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Bottom Left" android:layout_alignParentStart="true" android:layout_alignParentBottom="true" /> android:id="@+id/button4" android:text="Bottom Right" android:layout_alignParentEnd="true" android:id="@+id/button5" android:layout_width="fill_parent" android:text="Middle" android:layout_centerVertical="true" android:layout_centerHorizontal="true" /> </RelativeLayout> <RelativeLayout android:layout_width="fill_parent" android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android"> <Button android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Top Left" android:layout_alignParentStart="true" android:layout_alignParentTop="true" /> android:id="@+id/button2" android:text="Top Right" android:layout_alignParentTop="true" android:layout_alignParentEnd="true" /> 10/31/2019 Android Sensor Programming

Anchoring Views with RelativeLayout layout_alignParentStart—Aligns the view to the left of the parent view layout_alignParentEnd—Aligns the view to the right of the parent view layout_alignParentTop—Aligns the view to the top of the parent view layout_alignParentBottom—Aligns the view to the bottom of the parent view layout_centerVertical—Centers the view vertically within its parent view layout_centerHorizontal—Centers the view horizontally within its parent view 10/31/2019 Android Sensor Programming

Android Sensor Programming Anchoring Views with RelativeLayout Homework #8: Build an app that has the following output 10/31/2019 Android Sensor Programming

Detecting Orientation Changes Programmatically detect the current orientation of your activity: getResources() @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); if(getResources().getConfiguration().orientation == Configuration.ORIENTATION_LANDSCAPE){ Log.d("StateInfo", "Landscape"); }else if(getResources().getConfiguration().orientation == Configuration.ORIENTATION_PORTRAIT){ Log.d("StateInfo", "Portrait"); } 10/31/2019 Android Sensor Programming

Android Sensor Programming Controlling the Orientation of the Activity Sometimes, you might want the app to be displayed in only a certain orientation Using setRequestOrientation() method Or Using android:screenOrientation attribute on the <activity> element in AndroidManifest import android.content.pm.ActivityInfo; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); //---change to landscape mode--- setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE); } 10/31/2019 Android Sensor Programming

Android Sensor Programming Using android:screenOrientation attribute on the <activity> element in AndroidManifest <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.username.orientations"> <application android:allowBackup="true" android:icon="@mipmap/ic_launcher" android:label="@string/app_name" android:supportsRtl="true" android:theme="@style/AppTheme"> <activity android:name=".MainActivity" android:screenOrientation="landscape"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> </application> </manifest> Two other values that you can specify in the android:screenOrientation attribute: portrait—Portrait mode sensor—Based on the accelerometer (default) 10/31/2019 Android Sensor Programming

Android Sensor Programming Action Bar Action Bar displays the application icon and the activity title Optionally, on the right side of the Action Bar are action items 10/31/2019 Android Sensor Programming

Android Sensor Programming Adding Action Items Using Android Studio, create a new Android project and name it MyActionBar When prompted, select a Basic Activity as the template Modify the MainActivity.java file as follows import android.os.Bundle; import android.support.design.widget.FloatingActionButton; import android.support.design.widget.Snackbar; import android.support.v7.app.AppCompatActivity; import android.support.v7.widget.Toolbar; import android.view.View; import android.view.Menu; import android.view.MenuItem; import android.widget.Toast; public class MainActivity extends AppCompatActivity { 10/31/2019 Android Sensor Programming

Android Sensor Programming @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); setSupportActionBar(toolbar); FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab); fab.setOnClickListener(new View.OnClickListener() { public void onClick(View view) { Snackbar.make(view,"Replace with your own action", Snackbar.LENGTH_LONG).setAction("Action", null).show(); } }); public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. //getMenuInflater().inflate(R.menu.menu_main, menu); CreateMenu(menu); return true; 10/31/2019 Android Sensor Programming

Android Sensor Programming private void CreateMenu(Menu menu) { MenuItem mnu1 = menu.add(0, 0, 0, "Item 1"); { mnu1.setIcon(R.mipmap.ic_launcher); mnu1.setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM); } MenuItem mnu2 = menu.add(0, 1, 1, "Item 2"); mnu2.setIcon(R.mipmap.ic_launcher); mnu2.setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM); MenuItem mnu3 = menu.add(0, 2, 2, "Item 3"); mnu3.setIcon(R.mipmap.ic_launcher); mnu3.setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM); MenuItem mnu4 = menu.add(0, 3, 3, "Item 4"); mnu4.setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM); MenuItem mnu5 = menu.add(0, 4, 4,"Item 5"); mnu5.setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM); 10/31/2019 Android Sensor Programming

Android Sensor Programming private boolean MenuChoice(MenuItem item) { switch (item.getItemId()) { case 0: Toast.makeText(this, "You clicked on Item 1", Toast.LENGTH_LONG).show(); return true; case 1: Toast.makeText(this, "You clicked on Item 2",Toast.LENGTH_LONG).show(); case 2: Toast.makeText(this, "You clicked on Item 3",Toast.LENGTH_LONG).show(); case 3: Toast.makeText(this, "You clicked on Item 4",Toast.LENGTH_LONG).show(); case 4: Toast.makeText(this, "You clicked on Item 5",Toast.LENGTH_LONG).show(); } return false; 10/31/2019 Android Sensor Programming

Android Sensor Programming @Override public boolean onOptionsItemSelected(MenuItem item) { // Handle action bar item clicks here. The action bar will // automatically handle clicks on the Home/Up button, so long // as you specify a parent activity in AndroidManifest.xml. int id = item.getItemId(); //noinspection SimplifiableIfStatement if (id == R.id.action_settings) { return true; } return MenuChoice(item); 10/31/2019 Android Sensor Programming

Android Sensor Programming Overflow menu Clicking a menu item 10/31/2019 Android Sensor Programming

Android Sensor Programming Homework #9: Modify the ActionBar app by by altering the behavior when each action item is clicked in the following ways: When item1 through item4 is clicked, a TextView should be displayed on the screen at different locations (that is, the TextViews should not be at the same location or overlap with each other). When item5 is clicked, all existing TextViews that have been added to the screen should be cleared. 10/31/2019 Android Sensor Programming

Android Sensor Programming Creating UI Programmatically Using Android Studio, create a new Android project and name it UICode In the MainActivity.java file, add the bold statements in the following code: import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.support.v7.widget.LinearLayoutCompat; import android.widget.Button; import android.widget.LinearLayout; import android.widget.TextView; 10/31/2019 Android Sensor Programming

Android Sensor Programming @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); LinearLayoutCompat.LayoutParams params = new LinearLayoutCompat.LayoutParams( LinearLayoutCompat.LayoutParams.WRAP_CONTENT, LinearLayoutCompat.LayoutParams.WRAP_CONTENT); LinearLayout layout = new LinearLayout(this); //---create a layout--- layout.setOrientation(LinearLayout.VERTICAL); TextView tv = new TextView(this); //---create a textview--- tv.setText("This is a TextView"); tv.setLayoutParams(params); Button btn = new Button(this); //---create a button--- btn.setText("This is a Button"); btn.setLayoutParams(params); layout.addView(tv); //---adds the textview--- layout.addView(btn); //---adds the button--- //---create a layout param for the layout--- LinearLayoutCompat.LayoutParams layoutParam = LinearLayoutCompat.LayoutParams.WRAP_CONTENT ); this.addContentView(layout, layoutParam); } 10/31/2019 Android Sensor Programming

Android Sensor Programming 10/31/2019 Android Sensor Programming