亚洲免费在线-亚洲免费在线播放-亚洲免费在线观看-亚洲免费在线观看视频-亚洲免费在线看-亚洲免费在线视频

【Android Developers Training】 3. 構(gòu)建一個(gè)

系統(tǒng) 1818 0

注:本文翻譯自Google官方的Android Developers Training文檔,譯者技術(shù)一般,由于喜愛(ài)安卓而產(chǎn)生了翻譯的念頭,純屬個(gè)人興趣愛(ài)好。

原文鏈接: http://developer.android.com/training/basics/firstapp/building-ui.html


?

一.?構(gòu)建一個(gè)簡(jiǎn)單UI

一個(gè)Android應(yīng)用通過(guò) View ViewGroup 對(duì)象所組成的層次結(jié)構(gòu)來(lái)構(gòu)建圖形用戶(hù)接口(GUI)。通常 View 對(duì)象是一些UI控件,比如按鈕( buttons ),文本框( text fields )等。 ViewGroup 對(duì)象則是一些可見(jiàn)的裝載 View 對(duì)象的“容器”,同時(shí)它定義了它的子 View 對(duì)象是如何布局的,比如,定義子對(duì)象是應(yīng)該在網(wǎng)格狀布局列表中還是再垂直布局的列表中。

Android為每一種 View ViewGroup 的子類(lèi)提供了在XML中所對(duì)應(yīng)的詞匯,所以用戶(hù)可以在XML中通過(guò)使用一個(gè)UI元素的層次關(guān)系來(lái)定義自己的UI。 ?

圖1.? ViewGroup 的分支布局結(jié)構(gòu),每個(gè) ViewGroup 下包含了其他的 View 對(duì)象。

在這堂課中,你將會(huì)通過(guò)XML語(yǔ)句創(chuàng)建一個(gè)布局,這當(dāng)中包含了一個(gè)文本框和一個(gè)按鈕。在后續(xù)課程中,你將會(huì)實(shí)現(xiàn)按鈕按下后的響應(yīng)操作:把文本框中的內(nèi)容發(fā)送給另一個(gè)Activity。

實(shí)現(xiàn)布局方式的選擇 :在XML中聲明UI布局而不是在運(yùn)行時(shí)通過(guò)代碼來(lái)聲明是更加有效的,這其中有一些原因,最重要的,是你可以為不同規(guī)格的屏幕創(chuàng)建不同的布局。比如,你可以創(chuàng)建兩個(gè)版本的布局文件,并且告訴一同在小屏幕設(shè)備上使用其中一種布局,在大屏幕設(shè)備上使用另一種。可以通過(guò)閱讀 Supporting Different Devices 獲取更多這方面的信息。

?

一). 創(chuàng)建一個(gè)線性布局

在“ res/layout/ ”這一目錄下,打開(kāi)文件:“ activity_main.xml

:在Eclipse中,當(dāng)你打開(kāi)一個(gè)布局文件,你首先看到的將會(huì)是圖形布局編輯器( Graphical Layout editor ),通過(guò)使用 WYSIWYG工具(譯者注: WYSIWYG意為所見(jiàn)即所得 ),這個(gè)工具可以幫助你構(gòu)建布局。在這一堂課當(dāng)中,你將直接通過(guò)XML語(yǔ)句實(shí)現(xiàn)布局,所以點(diǎn)擊屏幕底部 activity_main.xml 這一標(biāo)簽進(jìn)入XML編輯器。

當(dāng)你創(chuàng)建這個(gè)項(xiàng)目工程的時(shí)候,你選擇的 BlankActivity模板包含了這個(gè) activity_main.xml 布局文件,在該文件當(dāng)中,有一個(gè) RelativeLayout 的根View和一個(gè) TextView 的子 View

首先,刪除 ? <TextView> 這一標(biāo)簽,同時(shí)將 <RelativeLayout> 改為 <LinearLayout> ,并且加上 android:orientation 這一屬性字段,將它設(shè)置為: horizontal ”。修改后的結(jié)果如下:

      
        <?
      
      
        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
      
      
        ="horizontal"
      
      
        >
      
      
        </
      
      
        LinearLayout
      
      
        >
      
    

這里 LinearLayout 是一個(gè)View Group對(duì)象( ViewGroup 的一個(gè)子類(lèi)),從方向上來(lái)說(shuō),它將它的子View布局在水平方向或垂直方向上,具體的方向由 android:orientation 這一屬性字段定義。每一個(gè) LinearLayout 的子View在屏幕上出現(xiàn)的先手順序與它在XML代碼里出現(xiàn)的先后順序一致。

另外兩個(gè)屬性字段: android:layout_width android:layout_height 對(duì)所有View對(duì)象來(lái)說(shuō)都是必須的,因?yàn)樗鼈兌x了View的尺寸。

由于 LinearLayout 是布局的根View,所以應(yīng)該通過(guò)把它的寬和高設(shè)置為 "match_parent" ,以此使它填滿(mǎn)整個(gè)屏幕區(qū)域。上述提到的這一屬性值的含義即將該View的寬和高延展只和它的父View的寬高一致。

更多信息,可以閱讀 Layout 幫助文檔。

?

二). 添加一個(gè)文本框

為了創(chuàng)建一個(gè)用戶(hù)可編輯的文本框,添加一個(gè) <EditText> 標(biāo)簽在 <LinearLayout> 中。

如同每一個(gè) View 對(duì)象,你必須通過(guò)定義特定的XML屬性字段來(lái)定義 EditText 對(duì)象的屬性。這里展示你應(yīng)該在 <LinearLayout> 標(biāo)簽中如何聲明它:

      
        <
      
      
        EditText 
      
      
        android:id
      
      
        ="@+id/edit_message"
      
      
        

        android:layout_width
      
      
        ="wrap_content"
      
      
        

        android:layout_height
      
      
        ="wrap_content"
      
      
        

        android:hint
      
      
        ="@string/edit_message"
      
      
        />
      
    

? 關(guān)于這些屬性字段

android:id

為該View提供唯一的Id標(biāo)識(shí),在你的應(yīng)用代碼中,你可以通過(guò)它來(lái)引用該對(duì)象,進(jìn)而讀取和操作這一對(duì)象(在下一次課程中將會(huì)學(xué)習(xí)的內(nèi)容)。

這個(gè)at(@)的符號(hào),是當(dāng)你在XML中引用任意資源對(duì)象所必須的。緊隨它之后的是資源的類(lèi)型(在此例中,類(lèi)型是id),一個(gè)斜線,和資源對(duì)象的名字( edit_message )?

這個(gè)在資源類(lèi)型前的加(+)號(hào),僅在你第一次定義一個(gè)資源ID時(shí)需要。當(dāng)你編譯你的應(yīng)用時(shí),SDK工具使用這個(gè)ID名字在你項(xiàng)目中的“ gen/R.java ”這一文件下會(huì)創(chuàng)建一個(gè)新的資源ID,該新ID會(huì)代表我們的 EditText 元素。一旦這個(gè)資源ID通過(guò)這種方式聲明好后,在其他地方對(duì)這個(gè)ID的引用就不在需要加號(hào)了。記住:僅在聲明一個(gè)新的 資源ID 的時(shí)候需要使用加號(hào),對(duì)于一些固有的資源,比如字符串(string),布局(layout)來(lái)說(shuō)則不需要。

關(guān)于資源對(duì)象

簡(jiǎn)單的來(lái)說(shuō),一個(gè)資源對(duì)象就是與一個(gè)應(yīng)用資源(比如一個(gè)位圖,一個(gè)布局文件或一個(gè)字符串)唯一關(guān)聯(lián)起來(lái)的整形形式的名字。在你的項(xiàng)目工程的 gen/R.java 文件下,每一個(gè)資源有一個(gè)與之對(duì)應(yīng)的資源對(duì)象。你可以通過(guò)使用在R類(lèi)中的對(duì)象名稱(chēng)來(lái)引用它對(duì)應(yīng)的資源,比如:當(dāng)你需要為 android:hint 這一屬性字段定義一個(gè)字符串的值時(shí)。同時(shí)你也可以通過(guò)在 android:id 這一屬性字段, 創(chuàng)建一個(gè)與該View關(guān)聯(lián)的資源ID,以此使你可以在其他的代碼位置對(duì)這個(gè)View進(jìn)行引用。

當(dāng)你每次編譯你的應(yīng)用時(shí),SDK工具會(huì)自動(dòng)生成 R.java 文件,你應(yīng)該永遠(yuǎn)都不要手動(dòng)修改這一文件。

閱讀 Providing Resources 來(lái)獲取更多信息。

android:layout_width android:layout_height

除了為寬和高定義特定的尺寸,使用 " wrap_content "這一屬性值意味著該View的大小剛好能適應(yīng)于它的內(nèi)容。如果你使用 " match_parent ",這個(gè) EditText 控件將會(huì)充滿(mǎn)整個(gè)屏幕,因?yàn)樗鼘?huì)和它的父View( LinearLayout )的尺寸保持一致。閱讀 Layouts 獲得更多信息。

android:hint

這是一個(gè)當(dāng)文本框內(nèi)容為空時(shí),默認(rèn)顯示的字符串。除了直接定義字符串的值外,還可以通過(guò) " @string/edit_message " ?這樣的方法來(lái)引用一個(gè)在其他文件定義了的字符串資源。因?yàn)檫@個(gè)引用是指向一個(gè)固有的資源(不是一個(gè)ID標(biāo)識(shí)),所以不需要加上加號(hào)。然后,因?yàn)槟氵€沒(méi)有定義這個(gè)字符串資源,所以你將會(huì)看到一個(gè)編譯錯(cuò)誤,你將在下一節(jié)通過(guò)定義這個(gè)字符串來(lái)解決這個(gè)問(wèn)題。

:這個(gè)字符串資源和這個(gè)空間的ID有著相同的名字: edit_message ,然而,對(duì)資源的引用會(huì)被限制在不同資源類(lèi)型特定的作用域內(nèi),因此在此例中,使用相同的名字也不會(huì)產(chǎn)生命名沖突。

?

三). 添加字符串資源

當(dāng)你需要在UI中添加文本時(shí),你應(yīng)該經(jīng)常講字符串定義為資源的形式,字符串資源可以允許你在同一個(gè)地方統(tǒng)一管理所有的UI文字,使得尋找和更新文字變得輕松。同時(shí),將字符串放在外部可以允許你通過(guò)為每一個(gè)字符資源提供不同的定義,解決你的應(yīng)用對(duì)于不同語(yǔ)言的本地化問(wèn)題。

默認(rèn)的,你的Android項(xiàng)目工程包含了一個(gè)字符串資源文件,這個(gè)文件位于:“ res/values/strings.xml ”。現(xiàn)在我們添加一個(gè)新的字符串,將它命名為“ edit_message ”,并且把它的值定義為“ Enter a message ”(你可以將字符串“ Hello World ”刪除)。

與此同時(shí),添加一個(gè)值為“ Send ”的字符串,它的名字為“ button_send ”,這是為之后將要添加的按鈕控件做的準(zhǔn)備工作。

修改后的 strings.xml 變?yōu)椋?

      
        <?
      
      
        xml version="1.0" encoding="utf-8"
      
      
        ?>
      
      
        <
      
      
        resources
      
      
        >
      
      
        <
      
      
        string 
      
      
        name
      
      
        ="app_name"
      
      
        >
      
      My First App
      
        </
      
      
        string
      
      
        >
      
      
        <
      
      
        string 
      
      
        name
      
      
        ="edit_message"
      
      
        >
      
      Enter a message
      
        </
      
      
        string
      
      
        >
      
      
        <
      
      
        string 
      
      
        name
      
      
        ="button_send"
      
      
        >
      
      Send
      
        </
      
      
        string
      
      
        >
      
      
        <
      
      
        string 
      
      
        name
      
      
        ="action_settings"
      
      
        >
      
      Settings
      
        </
      
      
        string
      
      
        >
      
      
        <
      
      
        string 
      
      
        name
      
      
        ="title_activity_main"
      
      
        >
      
      MainActivity
      
        </
      
      
        string
      
      
        >
      
      
        </
      
      
        resources
      
      
        >
      
      ?
    

關(guān)于使用字符串資源解決應(yīng)用對(duì)于不同語(yǔ)言的本地化問(wèn)題,更多的信息可以閱讀: Supporting Different Devices

?

四). 添加一個(gè)按鈕

現(xiàn)在在布局中添加一個(gè) <Button> 標(biāo)簽,它緊接著 <EditText> 標(biāo)簽:

      
        <
      
      
        Button

        
      
      
        android:layout_width
      
      
        ="wrap_content"
      
      
        

        android:layout_height
      
      
        ="wrap_content"
      
      
        

        android:text
      
      
        ="@string/button_send"
      
      
        />
      
    

把高度和寬度設(shè)置為“ wrap_content ”,這樣按鈕的大小正好適應(yīng)于按鈕的文字。這個(gè)按鈕控件暫時(shí)不需要 android:id 這一屬性字段,因?yàn)樗? activity 的代碼中暫時(shí)不會(huì)被引用到。

?

五). 使輸入框的寬度與屏幕寬度對(duì)應(yīng)

現(xiàn)在的布局被設(shè)計(jì)成 EditText Button 這兩個(gè)控件的大小和它們的內(nèi)容相適應(yīng),如圖2所示:

圖2. 寬度設(shè)置為“ wrap_content ”后的 EditText Button

這樣做對(duì)于按鈕來(lái)說(shuō)沒(méi)有什么問(wèn)題,但是對(duì)文本框來(lái)說(shuō)可能就不太好,因?yàn)橛脩?hù)可能會(huì)輸入更長(zhǎng)的字符串。所以最好是屏幕中沒(méi)有用到的寬度給文本框使用。我們可以在 LinearLayout 中使用 比重(Weight) 屬性來(lái)實(shí)現(xiàn),具體來(lái)說(shuō)是使用 android:layout_weight 這一屬性字段。

比重 的值是一個(gè)數(shù)字,這個(gè)數(shù)字用來(lái)表征每個(gè)View相對(duì)于它兄弟View所消耗的空間來(lái)說(shuō),可以使用的剩余的空間大小。可以理解為飲料的配方:“2份伏特加和1份咖啡甜酒”,這就意味著飲料中的三分之二是伏特加。例如:如果你給了一個(gè)View的 比重 是2,而另一個(gè)View的 比重 是1,那么他們的和是3,所以第一個(gè)View消耗剩余空間的三分之二,而第二個(gè)View消耗三分之一。如果你又添加了第三個(gè)View,它的 比重 是1,那么現(xiàn)在第一個(gè)View將會(huì)獲得剩余空間的一半,另外兩個(gè)則是四分之一。

默認(rèn)所有的View的 比重 是0,所以如果你僅對(duì)一個(gè)View的 比重 定義為大于0的任何數(shù),那么這個(gè)View將會(huì)拿到剩余的所有空間,而其他View則僅擁有他們所需要的空間。所以,為了讓 EditText 把剩余空間填滿(mǎn),把它的 比重 設(shè)置為1,同時(shí)讓按鈕沒(méi)有 比重 就可以實(shí)現(xiàn)了。

      
        <
      
      
        EditText

        
      
      
        android:layout_weight
      
      
        ="1"
      
      
        

        ... 
      
      
        />
      
    

當(dāng)你定義了 比重 時(shí),為了提高布局的效率,我們把 EditText 的寬度設(shè)置為0(0dp)。將寬度設(shè)置為0有利于提高布局性能,因?yàn)槭褂? wrap_content "作為寬度的話需要系統(tǒng)計(jì)算控件的寬度,而這是不必要的,因?yàn)檫@個(gè)寬度值需要另一個(gè)控件的寬度計(jì)算結(jié)果,以此來(lái)進(jìn)一步的填滿(mǎn)屏幕的寬度。

      
        <
      
      
        EditText

        
      
      
        android:layout_weight
      
      
        ="1"
      
      
        

        android:layout_width
      
      
        ="0dp"
      
      
        

        ... 
      
      
        />
      
    

圖3展示了把 比重 全部分配給 EditText 后的運(yùn)行結(jié)果:

圖3.? EditText 擁有了布局的所有 比重 ,所以它填滿(mǎn)了 LinearLayout 剩余的空間

現(xiàn)在,修改后的布局文件應(yīng)該是這樣的:

      
        <?
      
      
        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
      
      
        ="horizontal"
      
      
        >
      
      
        <
      
      
        EditText 
      
      
        android:id
      
      
        ="@+id/edit_message"
      
      
        

        android:layout_weight
      
      
        ="1"
      
      
        

        android:layout_width
      
      
        ="0dp"
      
      
        

        android:layout_height
      
      
        ="wrap_content"
      
      
        

        android:hint
      
      
        ="@string/edit_message"
      
      
        />
      
      
        <
      
      
        Button

        
      
      
        android:layout_width
      
      
        ="wrap_content"
      
      
        

        android:layout_height
      
      
        ="wrap_content"
      
      
        

        android:text
      
      
        ="@string/button_send"
      
      
        />
      
      
        </
      
      
        LinearLayout
      
      
        >
      
    

這個(gè)布局將會(huì)被當(dāng)你創(chuàng)建項(xiàng)目工程時(shí),SDK工具生成的默認(rèn) Activity 類(lèi)所應(yīng)用,現(xiàn)在你可以運(yùn)行這個(gè)應(yīng)用來(lái)看看結(jié)果:

  • 在Eclipse中,點(diǎn)擊工具欄中的“ 運(yùn)行 ”。
  • 或者在命令行下,將工作目錄切換至該Android項(xiàng)目的根目錄,然后執(zhí)行:
      
        ant debug

adb install bin/MyFirstApp-debug.apk
      
    

?

下一節(jié)課程將會(huì)進(jìn)一步學(xué)習(xí)按鈕的響應(yīng),從文本框中讀取數(shù)據(jù)和啟動(dòng)一個(gè)新的 activity 等知識(shí)。

?

【Android Developers Training】 3. 構(gòu)建一個(gè)簡(jiǎn)單UI


更多文章、技術(shù)交流、商務(wù)合作、聯(lián)系博主

微信掃碼或搜索:z360901061

微信掃一掃加我為好友

QQ號(hào)聯(lián)系: 360901061

您的支持是博主寫(xiě)作最大的動(dòng)力,如果您喜歡我的文章,感覺(jué)我的文章對(duì)您有幫助,請(qǐng)用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點(diǎn)擊下面給點(diǎn)支持吧,站長(zhǎng)非常感激您!手機(jī)微信長(zhǎng)按不能支付解決辦法:請(qǐng)將微信支付二維碼保存到相冊(cè),切換到微信,然后點(diǎn)擊微信右上角掃一掃功能,選擇支付二維碼完成支付。

【本文對(duì)您有幫助就好】

您的支持是博主寫(xiě)作最大的動(dòng)力,如果您喜歡我的文章,感覺(jué)我的文章對(duì)您有幫助,請(qǐng)用微信掃描上面二維碼支持博主2元、5元、10元、自定義金額等您想捐的金額吧,站長(zhǎng)會(huì)非常 感謝您的哦!!!

發(fā)表我的評(píng)論
最新評(píng)論 總共0條評(píng)論
主站蜘蛛池模板: 久久人人爽人人爽 | 老黄网站 | 四虎国产精品免费观看 | 日本猛妇色xxxxx在线 | 亚洲欧美色综合一区二区在线 | 男女免费视频 | 久久一本精品久久精品66 | 久久98精品久久久久久婷婷 | 久久香蕉精品成人 | 欧美va亚洲va在线观看蝴蝶网 | 久久精品国产精品青草不卡 | 日本成人不卡视频 | 亚洲欧美日韩中文字幕网址 | 久久婷婷久久一区二区三区 | 伊人第一页 | 免费a级在线观看完整片 | 亚洲最大视频网 | 日本一级毛片无遮挡 | 国产手机在线国内精品 | 最近免费中文字幕大全免费版视频 | 亚洲精品美女久久777777 | 久草在线视频资源站 | 曰批免费视频播放在线看片 | 欧美色大成网站www永久男同 | 波多结衣一区二区三区 | 国产一级强片在线观看 | 久久久亚洲精品视频 | 亚洲精品免费观看 | 亚洲另类 专区 欧美 制服 | 九九热视频在线播放 | 伊人第一路线 | 91成人爽a毛片一区二区 | www.黄色片网站 | 国产国拍亚洲精品午夜不卡17 | 欧美视频在线视频 | 中文在线亚洲 | 91亚洲视频在线观看 | 中文伊人 | 99re8热精品免费视频 | 免费在线观看黄色的网站 | 欧美国产综合日韩一区二区 |