C50108
Search…
職訓局里程碑
2019/0409/安卓工作室-物件導向事件驅動實作+Homework1&2

選擇、點選、拖曳…
系統事件
被程式設計師指定要某個事件處理函式處理系統事件
產生與使用者的互動
一系列特定的內容會包含在委派函式裡面
指定某元件監聽某事件
前面所有部分都是屬於UI (圖形與文字)
所以按下按鈕不會發生任何事件
有兩件事沒做 1.沒監聽事件 2.沒有委派處理函式
所以要有互動就必須設定以上兩點。
Layout屬於畫面
之後開始java的委派函式與監聽內容

第一行意思為 layout取出某id物件然後存到變數button1
用以處理委派函式
第三行對button1物件設定一個監控器
監聽點擊事件觸發new android.view.View.OnClickListener()函數

Java語言的架構為利用interface介面來實作委派呼叫,定義類別行為/規範、函式原形(規格/規格實際實現)
Ex1叫了一碗麵 每個人作的麵不太一樣 但都是麵
Ex2 證照英打1分鐘要打n個字 只要超過n個字你打幾個字都可以
Callback mether

操控物件,物件一定要有id
通常一個layout對應一個java

且如果存切換顯示,會造成監聽器/函式找不到物件報錯。
初始化面 layout
按鈕控制模組
Callback mether事件處理控制
首先新增一個對應頁面
Java右鍵new java or copy or new activity
Copy
如果要讓app初始頁面改動則必須去改動 manifests
開啟權限也會寫在這邊(相機gps…
當新增檔案後必須在這邊做類似註冊頁目的動作
Intent 意圖 呼叫別的畫面的內容
修改 .ManActivity 則可以修改app初始頁面
Android中為layout建立子資料夾 - 程式人生
想少寫物件位址就必須
using class packages (c#)
import class packages (java)
控制物件必須對應確切id
button2=(Button)findViewById(R.id.btn_2);
(button)為強制轉型

紅色定義了監聽器介面 interface
綠色的部分下面定義了事件處理函式 interface的架構不可更改
key下去會自動產生底下
藍色的部分定義了實際每一步動作
Ide觸發的事件超多

紅色監聽者對應綠色介面
定義了消防檢查員有哪些資格(安檢證照),
藍色部分
為消防法規規定了那些規格

package com.example.myapplication;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
public class Activity_Button_Java extends AppCompatActivity {
Button button1,button2;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_button_java);
button1=(Button)findViewById(R.id.btn_1);
button2=(Button)findViewById(R.id.btn_2);
button1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
button1.setText("已經按下");
button1.setBackgroundColor(0);
button1.setClickable(false);
button2.setText("按鈕2");
button2.setBackgroundResource(R.drawable.button_blue);
button2.setClickable(true);
}
});
button2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
button2.setText("已經按下2");
button2.setBackgroundColor(0);
button2.setClickable(false);
button1.setText("按鈕1");
button1.setBackgroundResource(R.drawable.button_blue);
button1.setClickable(true);
}
});
}
}
button是個class
view取值放入變數
操作變數屬性

座號: 08 姓名:劉育誠

 利用課堂介紹之View與ViewGroup元件,包括: Button、TextView 、ImageView、EditText,完成程式畫面之設計:
1. 以LinearLayout(線性佈局)設計一個使用者介面,並加入Button、TextView 、ImageView等元件,完成以下畫面設計。
 ImageView高度設定 200dp,載入資源drawable/picture01
 以水平LinearLayout排列3個Button,顯示(網站、APP、APP2)
 水平置中1個Button ,顯示 “我的按鈕”,字型大小
(10 sp)
2. 以Layout (相對佈局)設計一個使用者介面,並加入EditText、TextView 、Image View等元件,完成以下畫面設計。
 在畫面左上方及右下方,以垂直方向排列2次,載入系統圖片資源drawable/ sym_def_app_icon
 以水平置中、垂直置中方式排列1個TextView,顯示 “請問畫面上一共有幾個Android機器人圖案?”,字型大小(20 sp)
 在上一個TextView下方新增EditText,給定輸入提示(hint) "你的答案"
 在畫面右上方及左下方,分別以垂直方向排列2次及1次,載入系統圖片資源drawable/star_big_on
3. 以TableLayout (表格佈局)設計一個使用者介面,並加入Button、TextView 、ImageView等元件,完成以下畫面設計。
 TableRow 的方式新增3個TextView於第一行,顯示內容(“遊戲名稱”、 "遊戲版本"、"系統"),字型大小(30sp、20sp、30sp),前景色("#f70707"、"#00fd2a"、"#0004ff")
 將第一行"系統"區域背景設為背景色 "#00ff22"
 TableRow 的方式新增3個TextView於第二,四行,顯示內容("英雄聯盟"、 "Version 1.6.8"、"Android2.2")、("傳說對決"、"Version 1.8"、"Android 4.0"),字型大小(25sp、預設、預設)、(15sp、預設、預設)
 單獨新增ImageView、Button於第三,五行,載入資源drawable/star_big_on ,顯示 "選擇"
結果畫面截圖:
程式碼:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="200dp"
android:scaleType="fitCenter"
android:src="@drawable/picture01" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="我的名字"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_gravity="center"
>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="網站"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="網站"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="網站"/>
</LinearLayout>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textSize="10sp"
android:text="我的按鈕"/>
</LinearLayout>
(2)
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentRight="true"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@android:drawable/star_big_on"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@android:drawable/star_big_on"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentLeft="true"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@android:drawable/sym_def_app_icon"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@android:drawable/sym_def_app_icon"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="請問畫面上一共有幾個Android機器人圖案?"
android:textSize="20sp"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="match_parent"
android:hint="你的答案"
/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@android:drawable/sym_def_app_icon"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@android:drawable/sym_def_app_icon"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@android:drawable/star_big_on"
/>
</LinearLayout>
</RelativeLayout>
(3)
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:stretchColumns="1">
<TableRow>
<TextView
android:text="遊戲名稱"
android:textSize="30dp"
android:gravity="center"
android:textColor="#f70707"
/>
<TextView
android:text="遊戲版本"
android:gravity="center"
android:textColor="#00fd2a"
android:textSize="20dp"
/>
<TextView
android:text="系統"
android:background="#00ff22"
android:textColor="#0004ff"
android:textSize="30dp"
android:gravity="center"
/>
</TableRow>
<TableRow>
<TextView
android:text="英雄聯盟"
android:textSize="25dp"
android:gravity="center"
/>
<TextView
android:text="Version 1.6.8"
android:gravity="center"
/>
<TextView
android:text="Android 2.2"
android:gravity="center"
/>
</TableRow>
<ImageView
android:src="@android:drawable/star_big_on"
android:gravity="center" />
<TableRow>
<TextView
android:text="傳說對決"
android:textSize="15dp"
android:gravity="center"
/>
<TextView
android:text="Version 1.8"
android:gravity="center"
/>
<TextView
android:text="Android 4.0"
android:gravity="center"
/>
</TableRow>
<Button
android:text="選擇"/>
</TableLayout>
座號: 08 姓名:劉育誠

 利用課堂介紹之FrameLayout、GridLayout、ConstraintLayout布局方式,完成程式畫面之設計:
4. 以FrameLayout (框架佈局)設計一個使用者介面,並加入EditText、TextView 、ImageView等元件,完成類似畫面設計。
 ImageView寬度、高度設定為 "match_parent",scaleType屬性設定為"fitXY",載入任意資源圖片
 以水平置中方式排列1個EditText,顯示輸入提示(hint) "搜尋",字型大小(26~36 sp)
 以水平置中、垂直置中方式排列1個TextView,顯示
一連串自訂定文字
5. 以GridLayout (網格佈局)設計一個使用者介面,並加入Button、EditText等元件,完成類似畫面設計。
 以GridLayout 新增一個6 x 4大小的網格,設定屬性columnCount="4",rowCount="6"
 新增一個 TextView,跨4欄顯示,內部文字邊界左右(2~10 dp)、上下(2~10dp)(layout_marginLeft、layout_marginTop)
 分別依序新增按鈕,相對應的顯示文字如下圖,平均分配每一列的寬度空間給四個按鈕
 按鈕 "+" 需跨2列顯示,按鈕 "=" 需跨2欄顯示
6. 以ConstraintLayout (限制佈局)設計一個使用者介面,並加入Button、TextView、EditText 、ImageView等元件,完成類似畫面設計。
 新增ImageView寬度設定為 "match_parent"、高度設定(220~260)dp ,scaleType屬性設定為"fitCenter",載入任意資源圖片,絕對位置設定為"parent" (layout_constraintLeft_toLeftOf、layout_constraintTop_toTopOf)
 新增二組TextView、EditText,第一組的TextView上方及左方的邊界設定為"(15~25)dp",對齊ConstraintLayout容器左方以及上方ImageView下方(layout_constraintLeft_toLeftOf、layout_constraintTop_toBottomOf) 第一組EditText對齊TextView
 第二組的TextView上方及左方的邊界設定為"(15~25)dp",對齊Constraint Layout容器左方以及上方TextView下方(layout_constraintLeft_toLeftOf、layout_constraintTop_toBottomOf) ,EditText對齊TextView
 利用Guideline 在水平"(400~450)dp"、垂直"(140~200)dp"處新增參考線,並利用此二條參考線新
增二個Button("上一張"、"下一張")
結果畫面截圖:
程式碼
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
android:src="@drawable/picture01"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="搜尋"
android:layout_gravity="center_horizontal"
android:textSize="36sp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="這是懸崖峭壁!"
android:textColor="#FF4000"
android:textSize="64sp"
android:layout_gravity="center"/>
</FrameLayout>
(2)
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="4"
android:rowCount="6">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_columnSpan="4"
android:layout_rowSpan="1"
android:textSize="50dp"
android:layout_margin="10dp"
android:hint="0">
</TextView>
<Button
android:layout_width="80dp"
android:text="返回" />
<Button
android:layout_width="80dp"
android:text="清空" />
<Button
android:layout_width="80dp"
android:text="/" />
<Button
android:layout_width="80dp"
android:text="X" />
<!-- 需要把底下的格子補齊,合併格才會成功顯示。 -->
<Button
android:layout_width="80dp"
android:text="7"
/>
<Button
android:layout_width="80dp"
android:text="8"
/>
<Button
android:layout_width="80dp"
android:text="9"
/>
<Button
android:layout_width="80dp"
android:text="-"
/>
<!-- 下一行 -->
<Button
android:layout_width="80dp"
android:text="4"
/>
<Button
android:layout_width="80dp"
android:text="5"
/>
<Button
android:layout_width="80dp"
android:text="6"
/>
<Button
android:layout_width="80dp"
android:text="+"
android:layout_rowSpan="2"
android:layout_gravity="fill"
/>
<!-- 下一行 -->
<Button
android:layout_width="80dp"
android:text="1"
/>
<Button
android:layout_width="80dp"
android:text="2"
/>
<Button
android:layout_width="80dp"
android:text="3"
/>
<!-- 下一行 -->
<Button
android:layout_width="80dp"
android:text="0"
/>
<Button
android:layout_width="80dp"
android:text="."
/>
<Button
android:layout_width="80dp"
android:text="="
android:layout_columnSpan="2"
android:layout_gravity="fill_horizontal"
/>
</GridLayout>
(3)
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".activity_constraintlayout"
android:id="@+id/constraintLayout">
<ImageView
android:layout_width="match_parent"
android:layout_height="260dp"
android:src="@drawable/picture01"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:id="@+id/img1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="25dp"
android:layout_marginLeft="25dp"
android:text="懸崖:"
android:textSize="25dp"
app:layout_constraintLeft_toLeftOf="@+id/constraintLayout"
app:layout_constraintTop_toBottomOf="@id/img1"
android:id="@+id/texv1"/>
<EditText
android:id="@+id/editText2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="清水斷崖"
android:textSize="25dp"
app:layout_constraintBottom_toBottomOf="@+id/texv1"
app:layout_constraintLeft_toRightOf="@+id/texv1"
app:layout_constraintTop_toTopOf="@+id/texv1" />
<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="25dp"
android:layout_marginLeft="25dp"
android:text="拍攝日期:"
android:textSize="25sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/texv1" />
<EditText
android:id="@+id/editText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:hint="12/05"
android:inputType="textPersonName"
app:layout_constraintBottom_toBottomOf="@+id/textView"
app:layout_constraintStart_toEndOf="@+id/textView"
app:layout_constraintTop_toTopOf="@+id/textView" />
<android.support.constraint.Guideline
android:id="@+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_begin="394dp" />
<android.support.constraint.Guideline
android:id="@+id/guideline2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_begin="200dp" />
<Button
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="8dp"
android:text="下一張"
app:layout_constraintStart_toEndOf="@+id/button4"
app:layout_constraintTop_toTopOf="@+id/guideline" />
<Button
android:id="@+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:text="上一張"
app:layout_constraintEnd_toStartOf="@+id/guideline2"
app:layout_constraintTop_toTopOf="@+id/guideline" />
</android.support.constraint.ConstraintLayout>

Copy link
On this page
安卓工作室-java簡易實作
委派機制
物件導向事件驅動的方式
每個語言都有自己的Class packages熟讀就能對物件操控更理解
人家設計好class packages 就要遵照規則 (其實也可以自己定義)
開始java功能-操控物件
如何在頁面切換activity - 結果沒講只有講如何將初始頁面切換activity
實做設定監控器
Ex
程式碼
Homework 1 – 6
階段性作業一
階段性作業二
Baseline 基準底線