台灣蝸牛人生哲學

練習寫程式的時候蝸牛本身有遇到這問題,因此寫下來記錄一下.

若XML中有相同的R.id的話怎麼呼叫到不同的ViewFlipper頁面?

簡單的說:舉個例子"做個ABC學習的圖卡程式"畫面如下面三張圖

 當然實作的方式有很多種,但是今天是要用ViewFlipper.

1.先看learnabc.xml(單一畫面佈局,將被ViewFlipper include,其實就是上面圖片的layout)

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/FrameLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="tw.example.testkidsabc.MainActivity$PlaceholderFragment" >

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</LinearLayout>

<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="A"
android:textSize="100sp" />

<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Ant"
android:textSize="100sp" />

</LinearLayout>

</FrameLayout>

2.activity_main.xml 的佈局

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/FrameLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="tw.example.testkidsabc.MainActivity$PlaceholderFragment" >

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="right" >

<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="下一頁" />
</LinearLayout>

<ViewFlipper
android:id="@+id/viewFlipper1"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<include
android:id="@+id/layout1"
layout="@layout/learnabc" >
</include>

</ViewFlipper>

</FrameLayout>

3.MainActivity Class

import android.os.Bundle;
import android.support.v7.app.ActionBarActivity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
import android.widget.ViewFlipper;

public class MainActivity extends ActionBarActivity {
private Button bt1;
private ViewFlipper viewFlipper;
private TextView tv1, tv2;
private int myindex = 0; //作為ViewFlipper 頁面的index
private String[][] learnabc = { { "A", "Ant" }, { "B", "Book" },
{ "C", "Cat" } };//設定要顯示的字串

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

bt1 = (Button) findViewById(R.id.button1);   //此id在activity_main.xml 且唯一
bt1.setOnClickListener(listener);                   //按下一頁   
viewFlipper = (ViewFlipper) this.findViewById(R.id.viewFlipper1);
tv1 = (TextView) viewFlipper.getCurrentView().findViewById(
R.id.textView1);                                              //R.id.textView1在learnabc.xml裡面
tv1.setText(learnabc[myindex][0].toString());
tv2 = (TextView) viewFlipper.getCurrentView().findViewById(
R.id.textView2);
tv2.setText(learnabc[myindex][1].toString());
}

private Button.OnClickListener listener = new Button.OnClickListener() {
@Override
public void onClick(View v) {
int id = v.getId();
if (id == R.id.button1) {       //這裡也可以監聽R.id.textView1...
showNextView();
}
}
};

private void showNextView() {
// TODO 自動產生的方法 Stub
myindex = myindex + 1;
myindex=myindex%learnabc.length;
viewFlipper.showNext();
tv1 = (TextView) viewFlipper.getCurrentView().findViewById(
R.id.textView1);
tv1.setText(learnabc[myindex][0].toString());
tv2 = (TextView) viewFlipper.getCurrentView().findViewById(
R.id.textView2);
tv2.setText(learnabc[myindex][1].toString());
}

}

4.其實這句程式碼是重點viewFlipper.getCurrentView()

這裡有一張關聯圖片還滿清楚的可以參考(在右邊)