Golden-Android程式日誌紀錄: 7月 2014

2014年7月30日星期三

12.Android的getText()方法

在我撰寫Andorid的時候，有時程式的功能會需要取得Button、TextView、EditText等等元件的內容，一般會認為getText()這個方法所回傳的類型是String，但是情況卻不是這樣，參考下面錯誤的範例:

~~Button btn = (Button) findViewById(R.id.btn);~~
~~String str = btn.getText();~~

這樣的寫法看似正確，但是getText()並不是回傳String的型別，因此需要加上toString()的方法強制轉型為String，將上面的範例改為正確如下:


Button btn = (Button) findViewById(R.id.btn);
String str = btn.getText().toString();

2014年7月26日星期六

10.Android的Widget之輸入類別

Android提供EditText供使用者輸入資料，EditText所撰寫的方法非常的簡單，而它的屬性也很好理解，android:hint用來設定EditText提示的文字，android:password用來設定輸入的內容是否隱藏起來，參考下面的範例。


    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="帳號" />
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:password="true"
        android:hint="密碼" />

執行結果:

輸入後的結果:

AutoCompleteTextView同樣也是能夠給使用者輸入資料，不過它能夠提供自動提示的輸入功能，例如當輸入a的時候就會跑出apple、address、alert等等的提示，下面是xml檔和執行的結果圖。


    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="你最喜歡的程式語言是什麼?" />
    <AutoCompleteTextView
        android:id="@+id/autoCompleteTextView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

AutoCompleteTextView要有自動提示的文字必須要自己手動加入，這些文字可以在xml檔加入也可以在程式碼當中加入，下面是程式碼範例:


import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.*;


public class MainActivity extends Activity {
 
    final String[] language = {"C","C++","C#","Java","VB","JSP","Android","ASP.NET","PHP","Python"};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
          android.R.layout.select_dialog_item,language);
        
        AutoCompleteTextView autoCompleteTextView = (AutoCompleteTextView) findViewById
          (R.id.autoCompleteTextView);
        
        autoCompleteTextView.setThreshold(1);
        autoCompleteTextView.setAdapter(adapter);
    }
}

上面的程式範例中將想顯示的自動提示放入陣列中，並使用ArrayAdapter進行實作，ArrayAdapter能夠儲存字串陣列並且放入Android的List物件，最後setThreshold這個屬性是用來設定輸入多少字元會出現提示的文字，在範例中設定的值是1，因此輸入第一個字元之後就會有提示的文字，setAdapter是用來設定使用哪個ArrayAdapter。

MultiAutoCompleteTextView與AutoCompleteTextView都具有自動提示的功能，不同的地方是允許多個值可以自動提示的功能，程式的寫法與AutoCompleteTextView差不多，不過加入了一個分隔符號的屬性setTokenizer設定每個值之間的分隔符號。
new MultiAutoCompleteTextView.CommaTokenizer()是指英文的,號當作MultiAutoCompleteTextView的分隔符號，下面是程式碼範例與結果圖:

xml檔:


    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="你最喜歡的程式語言是什麼?" />
    <MultiAutoCompleteTextView
        android:id="@+id/multiAutoCompleteTextView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

程式碼:


import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.*;


public class MainActivity extends Activity {
 
    final String[] language = {"C","C++","C#","Java","VB","JSP","Android","ASP.NET","PHP","Python"};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
          android.R.layout.select_dialog_item,language);
        
        MultiAutoCompleteTextView multiAutoCompleteTextView = (MultiAutoCompleteTextView) findViewById
          (R.id.multiAutoCompleteTextView);
        
        multiAutoCompleteTextView.setThreshold(1);
        multiAutoCompleteTextView.setAdapter(adapter);
        multiAutoCompleteTextView.setTokenizer(new MultiAutoCompleteTextView.CommaTokenizer());
    }
}

除了上面介紹了這些輸入的類別之外Android還提供下拉式選單spinner，寫法跟前面所介紹的差不多，非常的簡單使用。

xml檔:


        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="你最喜歡的程式語言是什麼?" />
    <Spinner
        android:id="@+id/spinner"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

主程式:


import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.*;


public class MainActivity extends Activity {
 
    final String[] language = {"C","C++","C#","Java","VB","JSP","Android","ASP.NET","PHP","Python"};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
          android.R.layout.simple_spinner_item,language);
      
        Spinner spinner = (Spinner) findViewById(R.id.spinner);
        spinner.setAdapter(adapter);
    }
}

9.Android的Widget之按鈕

Android在android.widget.view底下有許多的元件提供使用者開發，一開始先介紹常用的按鈕Button和ImageButton。Android中的Button和ImageButton都能夠顯示圖片，不過這兩者還是有差別的，請看下面的範例。


    <Button 
        android:id="@+id/btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button"
        android:drawableLeft="@drawable/ic_launcher"
        android:onClick="function" />
    <ImageButton
        android:id="@+id/imgBtn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_launcher" />

範例中Button的android:drawableLeft是設定按鈕的圖案，因為Button中android:text屬性有設定文字，因此圖案會往左移動，因此Button會同時顯示圖案和文字，而ImageButton則無法同時顯示圖案和文字，ImageButton是用android:src設定按鈕的圖案，最後這兩個元件都能設定android:onClick來指定程式當中的事件，執行的結果如下。

接下來要介紹ToggleButton，看到這個元件的名稱就可以知道是用來開啟或關閉等等的功能，這個元件主要要設定的是開啟或關閉的文字，分別是android:textOn和android:textOff這兩個屬性設定文字，下面是xml檔的範例和執行的結果。


 <ToggleButton
     android:id="@+id/toggleButton"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:textOn="on"
     android:textOff="off" />

CheckBox也是非常常用到的功能按鈕，它能夠提供單選或是複選的功能，它在xml檔中的寫法與前面介紹的按鈕並沒有差別，因此可以直接參考xml檔和執行圖。


        <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="喜歡的活動:" />
        <CheckBox
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="電影" />
 <CheckBox
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="旅遊" /> 
 <CheckBox
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="逛街" />
 <CheckBox
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="運動" />

RadioButton與CheckBox有點類似，但不同的地方在於RadioButton只支援單選，但要使用RadioButton的單選需要RadioGroup配合，不然除了每一個RadioButton都能夠被選擇以外，還無法取消掉所選的選項，最後android:checked是設定是否程式一執行就被勾選，下面是xml檔與執行的結果。


        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="請選擇性別:" />
 <RadioGroup
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:orientation="horizontal">
     <RadioButton
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:checked="true"
         android:text="男" />
     <RadioButton
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="女" />
 </RadioGroup>

2014年7月25日星期五

8.Android之Intent

之前有說過一個Android的畫面就是一個Activity，在日後開發Android的時候不可能都只有使用一個Activity，因此需要使用Intent這個物件，假設有兩個Activity分別為A和B，A的Activity可以利用Intent跳到B的Activity。

下面這兩張圖片範例分別是A的Activity和B的Activity，當按下A的Activity的Send按鈕就會跳到B的Activity。

A的Activity

B的Activity

A的Activity程式碼如下:


import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.*;
import android.view.*;
import android.content.*;


public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        Button btn = (Button) findViewById(R.id.btn);
        btn.setOnClickListener(new View.OnClickListener(){
         public void onClick(View view) {
          Intent intent = new Intent(MainActivity.this,ActivityB.class);
          startActivity(intent);
         }
        });
    }

在這段程式碼中首先先實體化Button物件並找到在Layout中所定義的Button的ID，接下來定義Button按鈕事件並覆寫onClick方法，最後在實體化Intent，在這個例子中Intent需要兩個參數，從哪個Activity到個Activity，因此分別輸入所需的Activity，startActivity會讓Intent跳到下一個Activity。

Intent還有許多的用法,待續...

2014年7月24日星期四

2.C語言資料型態

C語言的資料型態有字元、整數、浮點數。這些資料的型態方便提供使用者設定變數，每種資料型態所佔用的記憶體大小和資料範圍會不太一樣，所佔用記憶體的大小會跟所使用的編譯器有關係，下面是各種資料型態的表示方法和資料大小的範圍。

字元：

char ： -128 ~ 127

整數：

int : -2147483648 ~ 2147483647
short : -32768 ~ 32767
long : -2147483648 ~ 2147483647
long long

浮點數：

float : 10^{^-38}~10^{^38}
double : 10^{^-308}~10^{^308}

另外C語言的整數型態包含了正整數和負整數，可以使用 signed和unsigned分別設定設定整數型態為有正負號和無正負號，例如unsigned int為無正負號，因為原來的整數型態就有包含正負號了，因此不用在用signed進行設定，下面的範例是顯示資料型態所佔用的位元組大小。


#include<stdio.h>

int main(void) {
        printf("%s%ld\n","char:",sizeof(char));
        printf("%s%ld\n","int:",sizeof(int));
        printf("%s%ld\n","short:",sizeof(short));
        printf("%s%ld\n","long:",sizeof(long));
        printf("%s%ld\n","long int:",sizeof(long int));
        printf("%s%ld\n","long long:",sizeof(long long));
        printf("%s%ld\n","float:",sizeof(float));
        printf("%s%ld\n","double:",sizeof(double));
        printf("%s%ld\n","unsigned int:",sizeof(unsigned int));
        printf("%s%ld\n","unsigned char:",sizeof(unsigned char));
        printf("%s%ld\n","unsigned short:",sizeof(unsigned short));
        printf("%s%ld\n","unsigned long:",sizeof(unsigned long));
        printf("%s%ld\n","unsigned long long:",sizeof(unsigned long long));

        return 0;
}

C語言在輸入輸出中有對應的輸入輸出格式，資料型態都會有對應的輸入輸出格式：

%d : 十進位整數
%o : 八進位整數
%x : 十六進位整數，超過10的數字以小寫表示，例如0xf
%X : 十六進位整數，超過10的數字以大寫表示，例如0xF
%u : 不帶符號的十進位整數
%c : 輸出字元
%s : 輸出字串
%e : 使用科學記號，e為小寫
%E : 使用科學記號，E為小寫
%ld: 長整數十進位整數
%f : 輸出浮點數

簡略的範例如下：


#include<stdio.h>

int main(void) {
        printf("%d\n",10);
        printf("%f\n",10.0);
        printf("%c\n",'a');

        return 0;
}

7.Activity生命週期

Android的Activity是具有生命週期的，我們撰寫Android時，在Eclipse裡新增一個Activity裡有onCreate方法，這個onCreate就是Android生命週期當中的其中一種，請參考下面兩張Android生命週期的圖。

參考圖片:http://developer.android.com/guide/components/activities.html

參考圖片:http://developer.android.com/training/basics/activity-lifecycle/starting.html

根據上面的我們可以知道Activity有許多的生命週期方法，將這些方法整理出來如下:

onCreate
onStart
onRestart
onResume
onPause
onStop
onDestroy

當程式執行時會先呼叫方法的順序為onCreate->onStart->onResume，接著在你的裝置上按下回主頁的畫面時呼叫的方法順序為onPause->onStop，再從主畫面切回之前被暫停的程式所發生的事件為onRestart->onStart->onResume，最後如果要結束程式按下返回鍵就可以了，執行方法的順序為onPause->onStop->onDestory。

2014年7月16日星期三

1.C語言基礎介紹

下面是C語言的hello world範例:


#include<stdio.h>

int main(void) {
        printf("hello world");

        return 0;
}

執行之後的結果會顯示hello world的文字。

現在來看第一行的程式碼#include<stdio.h>，#是C語言的一種前置處理，C語言再執行時會先執行前置處理再執行程式碼。include是指要導入的檔案，這個include是C語言標準函數庫中的標頭檔，主要提供C語言基本輸入、輸出的功能。

接下來看int main(void)這段程式碼，C語言程式是由main函式為程式執行的起點，將所想寫的程式寫在{}內就可以了。而函式可以有傳回值和無傳回值，int再C語言中是數值的型態，因此main函式需要一個數值的傳回值，void可以表達兩種意思，一種可以代表是函式為無傳回值，另一種表示為無參數，上面範例的main函式參數是main表示沒有參數的意思。

程式碼當中的printf()是一個函數，它的功能是將資料輸出到螢幕上，在上面的範例中是輸出hello world，最後一個是return是C語言的關鍵字，功能是函式結束所回傳的值，因為main函式是int數值類型，所以最後的回傳值是0這個數值，0也代表程式成功執行結束的意思。

2014年7月13日星期日

6.AbsoluteLayout

AbsoluteLayout是一個非常好學的Layout，但是不太會用，因為如果用絕對定位的方式定義元件的座標的話，不同手機的螢幕大小可能會導致你所設計的AbsoluteLayout排版產生問題，AbsoluteLayout主要有兩個功能:

android:layout_x:指定元件的x軸
android:layout_y:指定元件的y軸

AbsoluteLayout的xml範例:


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

 <Button
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_x="10px"
     android:layout_y="20px"
     android:text="進入" />
 <Button
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_x="380px"
     android:layout_y="20px"
     android:text="離開" />
    
</AbsoluteLayout>

很簡單吧!!

5.ActionBar

Android的ActionBar是一個很難搞的東西，除了版本的問題之外還有實體按鈕的MENU問題，導致我在摸索的時候花了很長的時間才了解問題的所在。

圖片來源:http://developer.android.com/guide/topics/ui/actionbar.html

圖片來源:http://www.androidhive.info/2013/11/android-working-with-action-bar/

上面第一張圖的3，在ActionBar中稱為Overflow，請參考第二張圖，這個Overflow也是問題的所在，因為在我寫好的Android程式執行之後完全找不到Overflow，問題的原因經過不斷的在網路上爬文找的答案是，如果你的機器上有MENU的按鈕則不會顯示Overflow，如果沒有才會顯示，因此Overflow只是給沒有MENU的機器所使用的。

在預設的Android中按MENU只會跳出Settings的MENU選項而已，這邊舉個例子增加MENU的選項，在res/menu目錄中找到你主要Activity的xml檔，以我的檔案為例，我的xml檔案名稱叫做main.xm，參考下面的範例:

main.xml


<menu 
    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"
    tools:context="com.example.golden.lab.MainActivity" >
    
    <item
        android:id="@+id/action_help"
        android:title="@string/action_help"
        android:icon="@drawable/ic_action_help"
        android:showAsAction="ifRoom" />

    <item
        android:id="@+id/action_settings"
        android:orderInCategory="100"
        android:title="@string/action_settings"
        android:showAsAction="always" />

</menu>

上面的範例main.xml新增了一個help的MENU，android:id是物件的名稱，為了撰寫程式所使用，在後面會提到。android:title是指在MENU中顯示的文字，因為有@string因此會參考到res/values/strings.xml，必須在裡面新增help文字。android:icon是提供MENU圖案的功能，不過我目前還是沒有成功就是了，Android有提供Action Bar Icon Pack提供使用者下載或是使用者也可以加入自己想要的icon圖案，只要將icon圖案加入到res/drawable每個解析度底下就可以使用了。最後android:showAsAction的功能有一些參數我列在下面:

ifRoom - 如果有ActionBar有空間的話會就會顯示item出來
withText - 顯示item的文字，可以搭配|來使用，例如ifRoom|withText
never - 不會顯示在ActionBar上面
always - 總是顯示在ActionBar上面，但官方的文件說不建議這樣做

現在已經在MENU中新增了help選項了，但是需要在Activity主程式中加入，但是因為我使用的Eclipse已經幫我做到這一點了，我就不需要再做這個動作了。

MainActivity.java


  public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
  }

不過網路上有不少人這樣寫:


   public boolean onCreateOptionsMenu(Menu menu) {
     MenuInflater inflater = getMenuInflater();
        inflater.inflate(R.menu.main, menu);
        return true;
   }

這兩者的寫法都可以產生MENU，要撰寫目錄的事件方法必須在onCreateOptionsMenu裡撰寫，MenuInflater是用來定義MENU用的，MenuInflater.inflate用來指定是哪個MENU。

最後我們將menu中的action_setting的android:showAsAction屬性改成never，再將action_help的android:showAsAction屬性改成always，使得action_help的icon能夠出現。


<menu 
    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"
    tools:context="com.example.golden.lab.MainActivity" >
    
    <item
        android:id="@+id/action_help"
        android:title="@string/action_help"
        android:icon="@drawable/ic_action_help"
        android:showAsAction="always" />

    <item
        android:id="@+id/action_settings"
        android:orderInCategory="100"
        android:title="@string/action_settings"
        android:showAsAction="never" />

</menu>

新增Item事件

目前已經完成新增MENU的項目了，但是點下所新增的help項目沒有任何的反應，因此接下來的動作必須新增help的事件動作。要新增item的事件動作必須在onOptionsItemSelected裡進行撰寫，設定按下help跳到另一個Activity。

MainActivity.java


public class MainActivity extends ActionBarActivity {

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


    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
     MenuInflater inflater = getMenuInflater();
        inflater.inflate(R.menu.main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
     switch(item.getItemId()) {
      case R.id.action_help:
       Help();
       return true;
      case R.id.action_settings:
       return true;
      default:
       return super.onOptionsItemSelected(item);
     }
    }
    
    private void Help() {
     Intent intent = new Intent(this,Help.class);
     startActivity(intent);
    }
}

在上面的onOptionsItemSelected函數中可以看到使用switch來判斷是按下哪一個item，如果是按下help則會呼叫Help()方法，Help()方法中使用Intent切換到另一個Activity，因此還必須新增一個help.java的Activity。

MainActivity.java畫面

按下help到help.java的畫面

返回Activity畫面

雖然上圖help的Activity有一個左邊的箭頭可以返回到main的Activity，但是實際上在我的手機上面沒有，因此接下來的動作要在help的Activity加上返回的動作。


public class Help extends Activity {

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_help);
   
  ActionBar actionBar = getActionBar();
  actionBar.setDisplayHomeAsUpEnabled(true);
 }

 @Override
 public boolean onCreateOptionsMenu(Menu menu) {
  getMenuInflater().inflate(R.menu.help, menu);
  return true;
 }

 @Override
 public boolean onOptionsItemSelected(MenuItem item) {
  switch(item.getItemId()) {
   case R.id.action_settings:
    return true;
   case android.R.id.home:
    NavUtils.navigateUpFromSameTask(this);
    return true;
   default:
    return super.onOptionsItemSelected(item);
  }
 }
}

使用actionBar.setDisplayHomeAsUpEnabled就可以讓ActionBar顯示返回的箭頭，但是不會返回到main的Activity，因此還必須在onOptionsItemSelected函數中加入android.R.id.home進行判斷，且利用NavUtils.navigateUpFromSameTask返回到主頁。

更換ActionBar icon和隱藏ActionBar

要更換ActionBar的icon很簡單，只需要一段文字actionBar.setIcon，指定好icon圖案就可以，接下來修改help的Activity來更換icon圖案，下面是範例。


protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_help);
   
 ActionBar actionBar = getActionBar();
 actionBar.setDisplayHomeAsUpEnabled(true);
 actionBar.setIcon(R.drawable.help);
}

從上面的圖可以看到icon已經被我換成自己所設定的了，除了主程式裡面可以更換icon還可以利用AndroidManifest.xml來進行設定，AndroidManifest.xml當中的<activity></activity>可以設定icon和ActionBar的標題，每一個<activity></activity>代表的是不同的Activity，因此可以根據不同的Activity畫面設定不同的icon，下面是範例:


<activity
            android:name=".MainActivity"
            android:label="Android"
            android:logo="@drawable/help" >
</activity>

android:label是設定ActionBar的標題，android:logo是設定ActionBar的icon ，如果要統一設定每個Activity的ActionBar的標題和icon在AndroidManifest.xml的<application></application>進行設定，請參考下面的範例:


<application
        android:allowBackup="true"
        android:icon="@drawable/help"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" >
</application>

設定每個Activity的icon和標題分別是android:icon和android:label，很簡單吧!!

ActionBar還有提供一個功能就是隱藏ActionBar，也是一樣只要一段文字就可以達成，actionBar.hide指的是將ActionBar隱藏起來，下面的範例一樣是針對help的Activity進行修改。


protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_help);
   
 ActionBar actionBar = getActionBar();
 actionBar.setDisplayHomeAsUpEnabled(true);
 actionBar.setIcon(R.drawable.help);
 actionBar.hide();
}

可以看到ActionBar完全消失了，如果要顯示ActionBar只要使用actionBar.show就可以了

待續...

2014年7月12日星期六

4.TableLayout

TableLayout是一個類似表格排列方式的layout，TableLayout使用TableRow將內容分行，TableLayout主要的功能有下面這幾個項目:

android:stretchColumns:將指定的欄位填滿剩餘的空間，可以用*代表是全部的欄位
android:shrinkColumns:將指定的欄位縮小空間，可以用*代表是全部的欄位
android:collapseColumns:將指定的欄位進行刪除

上面這些設定有一個地方是需要值得注意的欄位的編號是從0開始計算的，下面是TableRow中的功能:

android:layout_span:合併欄位的格數
android:layout_column:指定欄位的編號

下面是一些TableLayout的xml範例:


<TableLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:stretchColumns="*" >
    
 <TableRow>
     <TextView
         android:text="帳號:"
         android:padding="10px" />
     <EditText 
         android:padding="10px"
         android:layout_span="2" />
 </TableRow>
 <TableRow>
     <TextView
         android:text="密碼:"
         android:padding="10px" />
     <EditText 
         android:padding="10px"
         android:layout_span="2" />
 </TableRow>
 <TableRow>
     <Button
         android:text="登入" />
     <Button
         android:text="取消" />
     <Button
         android:text="註冊" />
 </TableRow>

</TableLayout>

上面這個範例android:stretchColumns="*"因為被設為是*號，因此影響了全部的欄位，全部的欄位都會填滿剩餘的空間，下面這個範例指定一個欄位來比較有什麼不同。


<TableLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:stretchColumns="0" >
    
 <TableRow>
     <TextView
         android:text="帳號:"
         android:padding="10px" />
     <EditText 
         android:padding="10px"
         android:layout_span="2" />
 </TableRow>
 <TableRow>
     <TextView
         android:text="密碼:"
         android:padding="10px" />
     <EditText 
         android:padding="10px"
         android:layout_span="2" />
 </TableRow>
 <TableRow>
     <Button
         android:text="登入" />
     <Button
         android:text="取消" />
     <Button
         android:text="註冊" />
 </TableRow>

</TableLayout>


<TableLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:shrinkColumns="*" >
    
 <TableRow>
     <TextView
         android:text="帳號:"
         android:padding="10px" />
     <EditText 
         android:padding="10px"
         android:layout_span="2" />
 </TableRow>
 <TableRow>
     <TextView
         android:text="密碼:"
         android:padding="10px" />
     <EditText 
         android:padding="10px"
         android:layout_span="2" />
 </TableRow>
 <TableRow>
     <Button
         android:text="登入" />
     <Button
         android:text="取消" />
     <Button
         android:text="註冊" />
 </TableRow>

</TableLayout>


<TableLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:collapseColumns="0" >
    
 <TableRow>
     <TextView
         android:text="帳號:"
         android:padding="10px" />
     <EditText 
         android:padding="10px"
         android:layout_span="2" />
 </TableRow>
 <TableRow>
     <TextView
         android:text="密碼:"
         android:padding="10px" />
     <EditText 
         android:padding="10px"
         android:layout_span="2" />
 </TableRow>
 <TableRow>
     <Button
         android:text="登入" />
     <Button
         android:text="取消" />
     <Button
         android:text="註冊" />
 </TableRow>
 
</TableLayout>

2014年7月11日星期五

3.RelativeLayout

RelativeLayout顧名思義就是相對位置的layout，這種layout中的元件需要設定所指定的元件才能進行排列，下面是RelativeLayout常用的功能。

android:layout_below:在所指定的元件下方
android:layout_above:在所指定的元件上方
android:layout_toLeftOf:在所指定的元件左方
android:layout_toRightOf:在所指定的元件右方
android:layout_alignTop:與所指定元件的上邊緣對齊
android:layout_alignBottom:與所指定元件的下邊緣對齊
android:layout_alignLeft:與所指定元件的左邊緣對齊
android:layout_alignRight:與所指定元件的右邊緣對齊
android:layout_alignBaseLine:與指定元件的文字在同一水平上
android:layout_alignParentRight:是否將此元件對齊於畫面右方的邊緣
android:layout_alignParentLeft:是否將此元件對齊於畫面右左方的邊緣
android:layout_alignParentTop:是否將此元件對齊於畫面上方的邊緣
android:layout_alignParentBottom:是否將此元件對齊於畫面下方的邊緣
android:layout_centerInParent:是否將此元件設定在畫面的正中間
android:layout_centerVertical:是否將此元件設定在畫面的垂直中間
android:layout_centerHorizontal:是否將此元件設定在畫面的水平中間

下面是RelativeLayout的xml範例和結果圖:


<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >
    
 <TextView
     android:id="@+id/label"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:text="輸入帳號和密碼:" />
 <EditText
     android:id="@+id/inputAccount"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:layout_below="@+id/label"
     android:hint="帳號" />
 <EditText
     android:id="@+id/inputPassword"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:layout_below="@+id/inputAccount"
     android:hint="密碼" />
 <Button
     android:id="@+id/btnCancel"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_below="@+id/inputPassword"
     android:layout_alignParentRight="true"
     android:layout_marginLeft="10px"
     android:text="取消" />
 <Button
     android:id="@+id/btnLogin"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_toLeftOf="@+id/btnCancel"
     android:layout_alignTop="@+id/btnCancel" 
     android:text="登入" />
  <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_alignParentBottom="true"
      android:layout_centerHorizontal="true"
      android:text="註冊" />

</RelativeLayout>

2.Android程式基礎介紹

在開始撰寫Android之前必須先了解Android的架構，從Eclipse中新增一個新的Android專案馬上就可以執行了，而這背後的運作是由許多的檔案所組成的!!

在專案中的src目錄底下就是Android主程式的檔案也就是一個Activity，所需要撰寫的程式碼就是在這裡。而每個Activity都有各自的Layout互相對應，Layout是一個xml檔放在res/layout底下，可以供使用者排版。

另外在目錄中可以看到AndroidManifest.xml，每一個Android都有這個檔案，這個檔案對於Android是相當重要的，許多相關的設定資訊都在這裡面。

待續...

1.LinearLayout

這個Layout最主要的地方需要注意的屬性是android:orientation，屬性值分別為horizontal(水平)和vertical(垂直)，下面先介紹horizontal的範例。

horizontal的xml範例程式碼:


<LinearLayout 
        xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

 <Button
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:text="1" />
 <Button
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:text="2" />
 <Button
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:text="3" />
   
</LinearLayout>

android:layout_width和android:layout_height的功能是指設定Android元件的寬度與高度，他的屬性有3個，分別是fill_parent、match_parent、wrap_content，fill_parent和match_parent兩個值都是將大小擴展到最大的寬度與高度，這兩個值其實沒有什麼不同，只是在官方文件中指出match_parent將會取代~~fill_parent~~，當然~~fill_parent~~還是可以持續的使用，官方文件參考網址在這裡。wrap_content這個值是將元件的大小根據元件中的內容適當的分配寬度和高度。

vertical的xml範例程式碼:


<LinearLayout 
        xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical" >

 <Button
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:text="1" />
 <Button
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:text="2" />
 <Button
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:text="3" />
   
</LinearLayout>

除了使用android:layout_width和android:layout_height設定寬度與高度以外，還可以使用權重值的方式來設定，android:layout_weight這個功能是用來設定權重值，權重值越高元件所佔的範圍會越大，參考下面的範例程式碼:


<LinearLayout 
        xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

 <EditText
     android:layout_weight="2"
     android:layout_width="0dp"
     android:layout_height="wrap_content" />
 <Button
     android:layout_weight="1"
     android:layout_width="0dp"
     android:layout_height="wrap_content"
     android:text="Submit" />
</LinearLayout>

根據Android官方文件的教學，如果有設定權重值的話，需要將寬或高設為0dp，而每個元件預設的權重值是0。

上面的方法都只是單純的使用水平或垂直的方式加入元件，用上面的方法沒有辦法排列成下面這張圖的Layout。

要形成這樣的Layout請參考下面的xml檔:


<LinearLayout 
        xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical" >
 
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
 <EditText
     android:layout_weight="2"
     android:layout_width="0dp"
     android:layout_height="wrap_content" />
 <Button
     android:layout_weight="1"
     android:layout_width="0dp"
     android:layout_height="wrap_content"
     android:text="Submit" />
 </LinearLayout>
 
 <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
 <EditText
     android:layout_weight="2"
     android:layout_width="0dp"
     android:layout_height="wrap_content" />
 <Button
     android:layout_weight="1"
     android:layout_width="0dp"
     android:layout_height="wrap_content"
     android:text="Submit" />
 </LinearLayout>
 
</LinearLayout>

訂閱：文章 (Atom)

網頁

2014年7月30日 星期三

2014年7月26日 星期六

2014年7月25日 星期五

2014年7月24日 星期四

2014年7月16日 星期三

2014年7月13日 星期日