小男孩‘自慰网亚洲一区二区,亚洲一级在线播放毛片,亚洲中文字幕av每天更新,黄aⅴ永久免费无码,91成人午夜在线精品,色网站免费在线观看,亚洲欧洲wwwww在线观看

搜索
分享

Android Visual Studio 跨平臺(tái)開發(fā)實(shí)戰(zhàn) Xamarin

 風(fēng)聲之家 2014-11-19
http://www./taihon64/archive/2013/08/26/115518.aspx


 

前言

不同於iOS, Xamarin 在Visual Studio中針對(duì)Android, 可以直接設(shè)計(jì)使用者介面. 在本篇教學(xué)文章中, 筆者會(huì)針對(duì)Android的專案目錄結(jié)構(gòu)以及基本控制項(xiàng)進(jìn)行介紹, 包含TextView, EditView, Toggle/ Switch以及Seekbar控制項(xiàng).

 

Android 專案目錄結(jié)構(gòu)

在Visual Studio建立Android 應(yīng)用程式專案後, 在方案總管中會(huì)看到如下圖的目錄結(jié)構(gòu)：

clip_image001

Assets： 放置在Assets資料夾中的檔案, 將會(huì)一起被封裝進(jìn)Android的封裝檔中(建置動(dòng)作要設(shè)定為"AndroidAsset"). 之後便可以透過如下的陳述式來存取Assets的資源。

1 public class ReadAsset : Activity
2   
3 {
4   
5 protected override void OnCreate (Bundle bundle) {
6   
7 base.OnCreate (bundle);
8   
9 InputStream input = Assets.Open ("my_asset.txt");}}

 

Resources：包含Drawable, Layout以及Values資料夾. Drawable用來放置圖片. 依照裝置的解析度不同, 還可以新增drawable-hdpi, drawable-mdpi, drawable-ldpi等資料夾來存放不同解析度的檔案. Layout資料夾則是存放使用者介面檔(副檔名為.axml). 而Value資料夾則是可以存放不同型別的XML對(duì)應(yīng)檔, 例如styles.xml, colors.xml… 針對(duì)Resources底下的檔案, 建置動(dòng)作請(qǐng)?jiān)O(shè)定為”AndroidResource”

若您開啟預(yù)設(shè)的Main.axml, 會(huì)看到如同底下的XML描述

clip_image002

  • LinearLayout: 主要的頁(yè)面框架, 以垂直或水平的方式排列頁(yè)面上的物件, 相當(dāng)於Silverlight 中的stack panel
  • @+id/[物件名稱]: 告訴Android parser, 為物件建立一個(gè)resource id
  • @string/[名稱]: 在String.xml中建立一個(gè)字串資源, 後續(xù)可供Resource類別存取.

上述的@string則會(huì)對(duì)應(yīng)到資料夾Resources\Values\String.xml

clip_image004

 

  • 名稱Hello對(duì)應(yīng)到UI中Button的Text屬性
  • 名稱ApplicationName對(duì)應(yīng)到專案屬性中的應(yīng)用程式名稱
  • 名稱Hello2為自行定義的字串資源.

有了以上的基本概念後, 接下來我們來介紹Android的基本控制項(xiàng)。

 

TextView

1. 開啟Lab03-BasicControls 專案並開啟Layout資料夾下的TextView.axml

clip_image005

 

2. 從左邊的工具列將TextView拖放到畫面中, 雙擊TextView並編輯文字

clip_image007

 

3. 接著拖拉一個(gè)TextView, 並在右邊的屬性視窗設(shè)定textcolor為#2A3748, textsize為24dip

clip_image008

 

4. 再拖拉一個(gè)TextView並輸入文字, 包含一個(gè)超連結(jié). 在屬性中將autolink的屬性值改為web.

clip_image009

結(jié)果如下:連結(jié)文字會(huì)自動(dòng)變成超連結(jié).

clip_image010

 

5. 最後拖拉一個(gè)TextView並輸入文字, 包含超過5位數(shù)的數(shù)字, 在屬性中將autolink的屬性值改為phone

clip_image011

結(jié)果如下: 數(shù)字被更改為超連結(jié)

clip_image012

 

6. 開啟TextViewScreen.cs 並在OnCreate 事件中載入Layout中的TextView

SetContentView(Resource.Layout.TextView);

7. 執(zhí)行專案並檢視及操作有連結(jié)的TextView內(nèi)容.

 

EditText

1. 開啟Layout資料夾下的EditText.axml

2. 從工具箱中拖拉1個(gè)Text(Small)及1個(gè)Plain Text物件到畫面上並編輯Text的文字如下：

clip_image013

 

將屬性中的autoText設(shè)為true

clip_image014

 

3. 拖拉一組Text及Plain Text物件到畫面上並編輯Text的文字如下：

clip_image015

 

將屬性中的capitalize設(shè)為words.

clip_image016

 

4. 拖拉一組Text及password物件到畫面上並編輯Text的文字如下：

clip_image017

 

5. 開啟EditTextScreen.cs 並在OnCreate 事件中載入Layout中的TextView

SetContentView(Resource.Layout.EditText);

6. 執(zhí)行專案, 在第一個(gè)欄位輸入錯(cuò)的單字, 將會(huì)出現(xiàn)拚字錯(cuò)誤及建議視窗.

clip_image018

 

7. 其他欄位效果如下：

clip_image019

 

Switch / Toggle button

Switch跟Toggle其實(shí)是很相似的控制項(xiàng), 都是控制開和關(guān)的選項(xiàng), 但顯示的方式有所不同. 我們?cè)谕粋€(gè)練習(xí)中使用這2個(gè)控制項(xiàng). (註: Switch控制項(xiàng)是在Android 4.0(API14)後才有, 因此在工具箱中找不到此控制項(xiàng), 必須在XML中自行輸入. 此外, 您的模擬器也必須是Android 4.0以上才能執(zhí)行)

1. 開啟SwitchToggle.axml. 在畫面上依序部署1個(gè)TextView, 用來顯示訊息, 1個(gè)ToggleButton以及1個(gè)Switch控制項(xiàng). 如下圖所示：

clip_image021

 

Axml的宣告如下, 請(qǐng)微調(diào)部份屬性：

01 <LinearLayout xmlns:android="http://schemas./apk/res/android"
02   
03 android:orientation="vertical"
04   
05 android:layout_width="fill_parent"
06   
07 android:layout_height="fill_parent">
08   
09 <TextView
10   
11 android:textAppearance="?android:attr/textAppearanceMedium"
12   
13 android:layout_width="fill_parent"
14   
15 android:layout_height="wrap_content"
16   
17 android:id="@+id/textView1" />
18   
19 <ToggleButton
20   
21 android:layout_width="fill_parent"
22   
23 android:layout_height="wrap_content"
24   
25 android:id="@+id/toggleButton1"
26   
27 android:textOn="開"
28   
29 android:textOff="關(guān)"
30   
31 android:layout_marginBottom="6.7dp" />
32   
33 <Switch
34   
35 android:layout_width="fill_parent"
36   
37 android:layout_height="wrap_content"
38   
39 android:textOn="開"
40   
41 android:textOff="關(guān)"
42   
43 android:id="@+id/Switch1"
44   
45 android:layout_marginRight="225.3dp" />
46   
47 </LinearLayout>

 

2. 開啟SwitchToggleScreen.cs. 並撰寫以下程式碼.

01 //載入頁(yè)面
02   
03 SetContentView(Resource.Layout.SwitchToggle);
04   
05 //宣告並取得控制項(xiàng)實(shí)體
06   
07 ToggleButton toggle = FindViewById<ToggleButton>(Resource.Id.toggleButton1);
08   
09 Switch _switch = FindViewById<Switch>(Resource.Id.Switch1);
10   
11 TextView msg = FindViewById<TextView>(Resource.Id.textView1);
12   
13 //處理Toggle Button的Click事件, 並將狀態(tài)顯示在TextView
14   
15 toggle.Click+= (sender, e) => {
16   
17 if (toggle.Checked) {
18   
19 msg.Text = "目前Toggle Button的狀態(tài)是\"開\"";}
20   
21 else{
22   
23 msg.Text = "目前Toggle Button的狀態(tài)是\"關(guān)\"";};};
24   
25 //處理Switch的Click事件, 並將狀態(tài)顯示在TextView
26   
27 _switch.Click += (sender, e) => {
28   
29 if (_switch.Checked) {
30   
31 msg.Text = "目前Switch Button的狀態(tài)是\"開\"";}
32   
33 else{
34   
35 msg.Text = "目前Switch Button的狀態(tài)是\"關(guān)\"";};};

Toggle Button及Switch 控制項(xiàng)的操作幾乎完全相同, 主要就是處理控制項(xiàng)的click事件並判斷目前的開關(guān)狀況.

3. 執(zhí)行專案並檢視執(zhí)行結(jié)果.

 

Seek Bar

1. 開啟seekBar.axml並從工具箱拖放TextView及SeekBar控制項(xiàng)進(jìn)螢?zāi)?/p>

clip_image022

 

介面宣告的xml如下：

01 <LinearLayout xmlns:android="http://schemas./apk/res/android"
02   
03 android:orientation="vertical"
04   
05 android:layout_width="fill_parent"
06   
07 android:layout_height="fill_parent">
08   
09 <TextView
10   
11 android:textAppearance="?android:attr/textAppearanceMedium"
12   
13 android:layout_width="fill_parent"
14   
15 android:layout_height="wrap_content"
16   
17 android:id="@+id/textView1" />
18   
19 <SeekBar
20   
21 android:layout_width="fill_parent"
22   
23 android:layout_height="wrap_content"
24   
25 android:id="@+id/seekBar1"
26   
27 android:layout_marginTop="48.0dp" />
28   
29 </LinearLayout>

2. 開啟SeekBarScreen.cs並在OnCreate事件中撰寫以下程式碼:

01 //載入頁(yè)面
02   
03 SetContentView(Resource.Layout.SeekBar);
04   
05 //宣告並取得頁(yè)面上的控制項(xiàng)
06   
07 var msg = FindViewById<TextView>(Resource.Id.textView1);
08   
09 var seekbar = FindViewById<SeekBar>(Resource.Id.seekBar1);
10   
11 //將seekBar的最大值設(shè)定為100
12   
13 seekbar.Max = 100;
14   
15 //處理SeekBar的ProgressChanged事件, 並將目前的大小(進(jìn)度)透過TextView呈現(xiàn)
16   
17 seekbar.ProgressChanged += (sender, e) => {
18   
19 msg.Text = string.Format("目前Seekbar的大小為{0}", seekbar.Progress.ToString());
20   
21 };

 

SeekBar的操作非常的直覺. 您只需要處理SeekBar控制項(xiàng)的ProgressChanged事件即可.

3. 執(zhí)行專案並檢視執(zhí)行結(jié)果.

clip_image023

 

結(jié)語(yǔ)

Android 的開發(fā)方式, 與先前介紹的iOS略有不同. iOS透過Outlet及Action將View及Controller進(jìn)行連結(jié). 而Android 則是透過Parser, 為頁(yè)面上的控制項(xiàng)建立id屬性, 讓Activity可以透過FindViewById方式建立控制項(xiàng)的物件實(shí)體, 接下來的處理方式就與iOS或Windows Form在操作控制項(xiàng)的方式類似. 在下一篇教學(xué)文章中, 將說明Android應(yīng)用程式的多頁(yè)面處理.

 

    本站是提供個(gè)人知識(shí)管理的網(wǎng)絡(luò)存儲(chǔ)空間，所有內(nèi)容均由用戶發(fā)布，不代表本站觀點(diǎn)。請(qǐng)注意甄別內(nèi)容中的聯(lián)系方式、誘導(dǎo)購(gòu)買等信息，謹(jǐn)防詐騙。如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容，請(qǐng)點(diǎn)擊一鍵舉報(bào)。
    轉(zhuǎn)藏 分享 獻(xiàn)花（0）

    0條評(píng)論

    發(fā)表

    請(qǐng)遵守用戶 評(píng)論公約

    類似文章 更多