Blog for Android Studio: 6月 2016

Android原件(merge、Intent)的應用─問卷小專題

前言

今日來設計一款能換頁的表單，就像問卷調查這樣。

由於這次的呈現方式像是個小專題，文章的長度會顯得比較龐大。(其實也沒多大啦XDD)

建議先下載github內的檔案來看，會比較不會那麼暈！

今日實作影片：

正文

三個地方需要實作：

一、Layout

二、Java

三、Strings.xml

一切都從Layout開始，有了畫面才會有驅動畫面的動力阿！

1、實作

首先先拉出四個Activity(三個Activity1~3 + 一個question_answer.xml)

Activity1、Activity2、Activity3是用來裝載題目的。

而question_answer.xml 是一個merge，不用設計她的Java可以單純創一個xml即可。

Layout佈局

MainActivity佈局

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

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="com.example.nikeru8.questionionnaire.MainActivity">

<Button

android:onClick="next"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="問券開始囉！"/>

</RelativeLayout>

Activity1~3佈局 (Activity1、Activity2、Activity3的布局都一模一樣)

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

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

android:orientation="vertical"

android:paddingBottom="@dimen/activity_vertical_margin"

android:paddingLeft="@dimen/activity_horizontal_margin"

android:paddingRight="@dimen/activity_horizontal_margin"

android:paddingTop="@dimen/activity_vertical_margin">

<include android:id="@+id/question_answer"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

layout="@layout/question_answer"/>

<LinearLayout

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:orientation="horizontal"

android:layout_gravity="center">

<Button

android:id="@+id/btn_back"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_gravity="center"

android:onClick="back"

android:text="BACK" />

<Button

android:id="@+id/btn_next"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_gravity="center"

android:onClick="next"

android:text="NEXT" />

</LinearLayout>

佈局解釋：

Activity1、Activity2、Activity3的布局都一模一樣就不再多貼了。

而上述的布局中include的用法是用來實現merge 的，再incude內使用以下兩種方法呼叫merge頁面！

android:id="@+id/question_answer"

layout="@layout/question_answer"

question_answer.xml佈局

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

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

android:orientation="horizontal">

<TextView

android:id="@+id/tv_no"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_gravity="center"

android:text="No."

android:textSize="96sp" />

<TextView

android:id="@+id/tv_question"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:paddingBottom="16dp"

android:textAppearance="@android:style/TextAppearance.Large"

tools:text="這裏是題目?" />

<RadioGroup

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:orientation="vertical">

<RadioButton

android:id="@+id/radio_a"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textAppearance="@android:style/TextAppearance.Medium"

android:onClick="click"

android:tag="A"

tools:text="A 答案" />

<RadioButton

android:id="@+id/radio_b"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textAppearance="@android:style/TextAppearance.Medium"

android:onClick="click"

android:tag="B"

tools:text="B 答案" />

<RadioButton

android:id="@+id/radio_c"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textAppearance="@android:style/TextAppearance.Medium"

android:onClick="click"

android:tag="C"

tools:text="C 答案" />

</RadioGroup>

</merge>

佈局解釋：

這裡的佈局畫面看起來很凌亂，不過不打緊，把merge頁面指定到activity內就不會有這個情況了。

指定到activity1~3內，因為是Layout佈局，

android:orientation="vertical"

有上面這行再催使question_answer.xml內的佈局排排站好！

使用<merge>可讓Activiy1~3內省去一層LinearLayout，直接用merge併入，節省系統資源提高直行效率！

再開始Java前，還有一個步驟要完成！

請妳把畫面移至values/strings.xml

Java內的文字要從strings.xml內取得。

Qnestion：為什麼要這麼麻煩呢？

Ans：這是為了解除耦合方便以後程式的維護！

試想如果以後問卷的問題要做改變的畫，可以直接從strings.xml內作變更，不用再從Activity內一個一個翻找作變更！

strings.xml

<string name="app_name">Questionionaire</string>

//第一題

//第二題

<![CDATA[

請問

\u00A0\u00A0\u00A0\u00A0<b><font color="blue"><merge></font></b>

在 android layout 的用途?

]]>

</string>

<string name="question_2_radio_a">根本就沒有這個功能</string>

<![CDATA[

將一個 layout 併入另一個 layout,<br>

可節省一層 <b>ViewGroup</b>

]]>

</string>

<string name="question_2_radio_c">版本控制系統用來合併不同的分支</string>

//第三題

<![CDATA[

請問<br>切換 Activity 要呼叫哪個方法?

]]>

</string>

<string name="question_3_radio_a">startActivit()</string>

<string name="question_3_radio_b">startActivityForResult()</string>

</resources>

Java佈局

MainActivity佈局

package com.example.nikeru8.questionionnaire;

import android.content.Intent;

import android.support.v7.app.AppCompatActivity;

import android.os.Bundle;

import android.view.View;

public class MainActivity extends AppCompatActivity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

}

// 按下 NEXT (切下一個畫面 Activit1)

public void next(View view) {

//Intent(現在這個位置 , 選擇下一頁的位置);

Intent intent = new Intent(this, Activity1.class);

startActivity(intent);

}

佈局解釋：

這頁就一個簡單的Intent應用，我並沒有寫在Intent大全內，就在此做個介紹吧，這是Intent最簡單、最實用也最重要的方法，沒有之一！

Intent intent = new Intent(this, Activity1.class);

startActivity(intent);

Activity1布局

package com.example.nikeru8.questionionnaire;

import android.content.Intent;

import android.os.Bundle;

import android.support.v7.app.AppCompatActivity;

import android.text.Html;

import android.view.View;

import android.widget.RadioButton;

import android.widget.TextView;

public class Activity1 extends AppCompatActivity {

public static final String Q1_ANSWER_KEY = "Q1";

//設定參數

private TextView m_tv_no;

private TextView m_tv_question;

private RadioButton m_radio_a;

private RadioButton m_radio_b;

private RadioButton m_radio_c;

private CharSequence m_answer;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_1);

init();

}

//起始畫面，設定起始畫面的按鈕

private void init() {

m_tv_no = (TextView)findViewById(R.id.tv_no);

m_tv_question = (TextView)findViewById(R.id.tv_question);

m_radio_a = (RadioButton)findViewById(R.id.radio_a);

m_radio_b = (RadioButton)findViewById(R.id.radio_b);

m_radio_c = (RadioButton)findViewById(R.id.radio_c);

//題號

m_tv_no.setText("1");

//第一題的問題

m_tv_question.setText(Html.fromHtml(getString(R.string.question_1)));

//radio第一個選擇

m_radio_a.setText(Html.fromHtml(getString(R.string.question_1_radio_a)));

//radio第二個選擇

m_radio_b.setText(Html.fromHtml(getString(R.string.question_1_radio_b)));

//radio第三個選擇

m_radio_c.setText(Html.fromHtml(getString(R.string.question_1_radio_c)));

}

//返回上一頁

public void back(View view) {

finish();

}

// 按下 NEXT

public void next(View view) {

// 建立新 Intent: new Intent( 來源 , 目的);

Intent intent = new Intent(this, Activity2.class);

startActivity(intent);

}

Activity2佈局

import android.os.Bundle;

import android.support.v7.app.AppCompatActivity;

import android.text.Html;

import android.view.View;

import android.widget.RadioButton;

import android.widget.TextView;

public class Activity2 extends AppCompatActivity {

public static final String Q2_ANSWER_KEY = "Q2";

private TextView m_tv_no;

private TextView m_tv_question;

private RadioButton m_radio_a;

private RadioButton m_radio_b;

private RadioButton m_radio_c;

private CharSequence m_answer;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_2);

init();

}

private void init() {

m_tv_no = (TextView)findViewById(R.id.tv_no);

m_tv_question = (TextView)findViewById(R.id.tv_question);

m_radio_a = (RadioButton)findViewById(R.id.radio_a);

m_radio_b = (RadioButton)findViewById(R.id.radio_b);

m_radio_c = (RadioButton)findViewById(R.id.radio_c);

m_tv_no.setText("2");

m_tv_question.setText(Html.fromHtml(getString(R.string.question_2)));

m_radio_a.setText(Html.fromHtml(getString(R.string.question_2_radio_a)));

m_radio_b.setText(Html.fromHtml(getString(R.string.question_2_radio_b)));

m_radio_c.setText(Html.fromHtml(getString(R.string.question_2_radio_c)));

}

// 按下 BACK

public void back(View view) {

finish();

}

// 按下 NEXT

public void next(View view) {

// 建立新 Intent: new Intent( 來源 , 目的)

Intent intent = new Intent(this, Activity3.class);

startActivity(intent);

}

Activity3佈局

public static final String Q3_ANSWER_KEY = "Q3";

private TextView m_tv_no;

private TextView m_tv_question;

private RadioButton m_radio_a;

private RadioButton m_radio_b;

private RadioButton m_radio_c;

private CharSequence m_answer;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_3);

init();

}

private void init() {

m_tv_no = (TextView)findViewById(R.id.tv_no);

m_tv_question = (TextView)findViewById(R.id.tv_question);

m_radio_a = (RadioButton)findViewById(R.id.radio_a);

m_radio_b = (RadioButton)findViewById(R.id.radio_b);

m_radio_c = (RadioButton)findViewById(R.id.radio_c);

m_tv_no.setText("3");

m_tv_question.setText(Html.fromHtml(getString(R.string.question_3)));

m_radio_a.setText(Html.fromHtml(getString(R.string.question_3_radio_a)));

m_radio_b.setText(Html.fromHtml(getString(R.string.question_3_radio_b)));

m_radio_c.setText(Html.fromHtml(getString(R.string.question_3_radio_c)));

}

// 按下 MAIN

public void main(View view) {

Intent intent=new Intent(this,MainActivity.class);

startActivity(intent);

}

// 按下 BACK

public void back(View view) {

finish();

}

佈局解釋：

Activity1、Activity2、Activity3的Java程式碼基本上一樣，改動理面的數字即可！

講解一下I

今天就到這了。實作完成！

2、注意的事情

做到現在RadioButton還沒有實作，所以按下會崩潰！

下一章節將會實作RadioButton和這小專題和adapter作個連結。

Github連結：

https://github.com/nikeru8/Questionionnaire

Intent

Intent大全(一) 撥打電話http://nikeru8.blogspot.tw/2016/06/intent.html

Intent大全(二)- googlemap應用、網頁連結、地圖作標、路徑規劃、簡訊http://nikeru8.blogspot.tw/2016/06/intentgooglemap_21.html

Intent換頁應用、Activity的換頁使用http://nikeru8.blogspot.tw/2016/06/android-intentmerge.html

Blog for Android Studio

show code block

2016年6月28日星期二

名詞解釋-static、abstract、interface

名詞解釋-static、abstract、interface

2016年6月22日星期三

Android原件(merge、Intent)的應用─問卷小專題

使用<merge>可讓Activiy1~3內省去一層LinearLayout，直接用merge併入，節省系統資源提高直行效率！

協程(coroutine) - 協程為什麼要學它？

show code block

2016年6月28日 星期二

名詞解釋-static、abstract、interface

名詞解釋-static、abstract、interface

2016年6月22日 星期三

Android原件(merge、Intent)的應用─問卷小專題

使用<merge>可讓Activiy1~3內省去一層LinearLayout，直接用merge併入，節省系統資源提高直行效率！

協程(coroutine) - 協程為什麼要學它？

2016年6月28日星期二

2016年6月22日星期三