Android Basic Development Day 1 Introduction & ADT

Basic Programming

by Eakapong Kattiya www.ibluecode.com [email protected] +66 086-673-2111Monday, May 27, 13

http://www.ibluecode.com


mailto:[email protected]


Android applications development process

Day 1

Day 1 - 4

Day 5-6

Day 5-6






Android Version






Application Design






UI Overview

1. Main Action Bar (API 11)

2. View Control

3. Content Area

4. Split Action Bar (API 11)

5. Options Menu

5






Fixed Tab SpinnerNavigation Drawers

Application Structure






Fixed Tabs : Movies , Twitter

Fixed Tabs- ต้องการเน้นให้ผู้ใช้เห็นข้อมูลหน้าอื่น ๆ - ใช้เมื่อต้องสลับหน้าจอ(View) บ่อย ๆ- จํานวน Top Level View ไม่ควรเกิน 3-5






Scrollable Tabs : Google Play Store






Stacked Tabs : You Tube






GmailHolo Light

SettingHolo Dark

Talk inHolo Light with Dark

action bar

Theme (ice cream sandwich : API 15)






Metrics and Grid

Button ~48dpGap ~8 dp

Size should be specified in dp (density-independent pixels ) do not use = px (pixel)






Font

Font size should be sp (scale-independent pixels) do not use = pt (point)






AndroidManifest.xml

<uses-sdk android:minSdkVersion="11" android:targetSdkVersion="17" />

<activity android:name="MainActivity" android:label="@string/app_name" android:configChanges = "orientation|keyboard">  <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity>

<uses-permission android:name="android.permission.INTERNET" />






Styles and Themes

<TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:textColor="#00FF00" android:typeface="monospace" android:text="@string/hello" />

<TextView style="@style/CodeFont" android:text="@string/hello" />

<?xml version="1.0" encoding="utf-8"?><resources> <style name="CodeFont" parent="@android:style/TextAppearance.Medium"> <item name="android:layout_width">fill_parent</item> <item name="android:layout_height">wrap_content</item> <item name="android:textColor">#00FF00</item> <item name="android:typeface">monospace</item> </style></resources>






icon name

Asset Type Prefix Example

Icons ic_ ic_star.png

Launcher icons ic_launcher ic_launcher_calendar.png

Menu icons and Action Bar icons ic_menu ic_menu_archive.png

Status bar icons ic_stat_notify ic_stat_notify_msg.png

Tab icons ic_tab ic_tab_recent.png

Dialog icons ic_dialog ic_dialog_info.png






Android Drawables (www.androiddrawables.com)


http://www.androiddrawables.com

http://www.androiddrawables.com





Eclipse Shortcuts

Ctrl + Shift + Space : Show method parameterFn + Cmd + F11 : RunCmd + i : Correct Code IndentationRotate Device : Fn(F12) + Control






Create Android Application






Create Android Application : Step 1






























Activity






Activity

Setting Activity

Fullscreen Activity

Login Activity






Create New Activity : Step 1



















Add 3 Blank Activity

- FirstActivity- WebViewActivity- DialogActivity






Login Activity

Add New Login Activity

-LoginActivity.java-activity_login.xml






Settings Activity

Add New Settings Activity

-SettingsActivity.java-activity_settings.xml






Menu






Menu

Options Menu(< API 10)

Action Bar(> API 11)






Menu : edit main.xml

<menu xmlns:android="http://schemas.android.com/apk/res/android" > <item android:id="@+id/action_settings" android:orderInCategory="100" android:showAsAction="always" android:title="@string/action_settings"/> <item android:id="@+id/action_login" android:orderInCategory="90" android:showAsAction="ifRoom" android:title="Login"/> <item android:id="@+id/action_about" android:icon="@drawable/ic_launcher" android:orderInCategory="91" android:showAsAction="ifRoom" android:title="About"/></menu>

android:showAsAction=["ifRoom" | "never" | "withText" | "always" | "collapseActionView"]


http://schemas.android.com/apk/res/android

http://schemas.android.com/apk/res/android





Menu : Add Custom Menu : MainActivity.java

@Overridepublic boolean onCreateOptionsMenu(Menu menu) {

getMenuInflater().inflate(R.menu.main, menu);

//add custom menumenu.add("Save")

.setIcon(android.R.drawable.ic_menu_save) .setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);

menu.add("Search") .setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS | MenuItem.SHOW_AS_ACTION_WITH_TEXT);

menu.add("Gallery") .setIcon(android.R.drawable.ic_menu_gallery) .setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS | MenuItem.SHOW_AS_ACTION_WITH_TEXT);

return true;}






Menu : edit MainActivity.java

public boolean onOptionsItemSelected(MenuItem item) { switch (item.getItemId()) {

case R.id.action_settings: startActivity(new Intent(this, SettingsActivity.class)); return true;

case R.id.action_login: startActivity(new Intent(this, LoginActivity.class)); return true;

case R.id.action_about: startActivity(new Intent(this, WebViewActivity.class)); return true;

default: return super.onOptionsItemSelected(item); } }






Menus

Floating context menu Contextual action bar Checkable menu Popup Menu






WebView

Add New Blank Activity

-WebViewActivity.java-activity_webview.xml






Progress Bar

Progress bars

Activity bar

progressBarStyleHorizontal progressBarStyleLarge

progressBarStyle






Add Permission : AndroidManifest.xml

WebView : activity_webview.xml

<WebView android:id="@+id/webView1" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_alignParentLeft="true" android:layout_centerVertical="true" />

<ProgressBar android:id="@+id/progressBar1"

style="?android:attr/progressBarStyleLarge" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_centerVertical="true"/>

style="?android:attr/progressBarStyle"style="?android:attr/progressBarStyleSmall"style="?android:attr/progressBarStyleLarge"style="?android:attr/progressBarStyleHorizontal"

<uses-permission android:name="android.permission.INTERNET"/>






WebView : WebViewActivity.java

String urlString = "http://www.ibluecode.com" ;

WebView webView = (WebView) findViewById(R.id.webView1);webView.loadUrl(urlString);

WebSettings webSettings = webView.getSettings(); webSettings.setJavaScriptEnabled(true);

final ProgressBar progressBar = (ProgressBar)findViewById(R.id.progressBar1); webView.setWebViewClient(new WebViewClient(){ @Override public void onPageStarted(WebView view, String url, Bitmap favicon) { progressBar.setProgress(0); progressBar.setVisibility(View.VISIBLE); }

@Override public void onPageFinished(WebView view, String url) { progressBar.setProgress(100); progressBar.setVisibility(View.GONE); }

@Override public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); return true; } });}








WebView : WebViewActivity.java

String urlString = "http://www.ibluecode.com" ;//Intent intent = getIntent();if( intent.getExtras() != null){ urlString = intent.getExtras().get("url").toString() ; }//WebView webView = (WebView) findViewById(R.id.webView1);

webView.loadUrl(urlString);

WebSettings webSettings = webView.getSettings(); webSettings.setJavaScriptEnabled(true);

final ProgressBar progressBar = (ProgressBar)findViewById(R.id.progressBar1); webView.setWebViewClient(new WebViewClient(){

@Overridepublic void onPageStarted(WebView view, String url, Bitmap favicon) { progressBar.setProgress(0); progressBar.setVisibility(View.VISIBLE);

}

@Override public void onPageFinished(WebView view, String url) { progressBar.setProgress(100); progressBar.setVisibility(View.GONE); } @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); return true; } });}

Get Data from Intent

Technology

Android Basic Development Day 1 Introduction & ADT