Android教程網
  1. 首頁
  2. Android 技術
  3. Android 手機
  4. Android 系統教程
  5. Android 游戲
 Android教程網 >> Android技術 >> 關於Android編程 >> Android 用戶登錄界面

Android 用戶登錄界面

編輯:關於Android編程

本篇博客主要給大家演示如何一步一步地創建一個類似於下圖展示的這麼一個UI界面:

\

一、准備圖片資源<喎?/kf/ware/vc/" target="_blank" class="keylink">vc3Ryb25nPjwvcD4KPHA+vMfXoaO608nT2kRlbW+1sdbQ08O1vbXEzbzGrNfK1LS2vMrH1rG907TTyc/D5s28xqy92MihtcSjrMv50tTNvMas1srBv8nPw+a74bLu0rvQqaOssru5/aOssrvTsM/sztLDx7XE0d3KvtCnufuho9b30qrXvLG40tTPwsj91cXNvMaso7o8L3A+CjxwPjGjqWZhY2Vib29rX2Nvbm5lY3QucG5nPGJyPgo8L3A+CjxwPjKjqWxpbmtlZGluX2Nvbm5lY3QucG5nPC9wPgo8cD4zo6lpY19oaWdobGlnaHQucG5nPC9wPgo8cD7XvLG4usPBy7n9uvOjrNaxvdO4tNbGtb3O0sPHRGVtb7Wx1tC1xGRyYXdhYmxlLXhoZHBpzsS8/rzQtbHW0KGjPC9wPgo8cD7U2tX9yr23otDQtcRBcHC1sdbQo6zOqsHL0qrKysXksrvNrLfWsebCyrXEz9TKvtCnufujrNPQ0rvQqc28xqyjrM7Sw8fN+c35u+HXvLG4tuDM16GjzqrBy9Hdyr61xLe9seOjrM7Sw8fWu9e8sbjBy9K7zNfKysXkeGhkcGm31rHmwsq1xM28xqyhozwvcD4KPHA+PHN0cm9uZz62/qGiv6rKvLK8vtY8L3N0cm9uZz48L3A+CjxwPrK8vta1sdbQvau74bD8wKjS1M/CvLi49lVJv9i8/qO6PC9wPgo8cD48L3A+CgpUZXh0Vmlld6OoVG8gdXNlIGhpZ2hsaWdodC4uLqOpSW1hZ2VCdXR0b26jqEZhY2Vib29ro6lJbWFnZUJ1dHRvbqOoTGlua2VkSW6jqVRleHRWaWV3o6hXaHkgbm90IGVtYWlsP6OpVGV4dFZpZXejqEhpZ2hsaWdodCBpcyBiYXNlZC4uLqOpVGV4dFZpZXejqFBsZWFzZSBsZXQgdXMga25vdy4uLqOpVGV4dFZpZXejqFdlIHdpbGwgbm90IHBvc3QgdGhpbmdzIHdpdGhvdXQuLi6jqQo8cD48c3Ryb25nPrXa0ruyvaO6sry+1rGzvrDJ6NbDPC9zdHJvbmc+PC9wPgo8cD7Sqr2rsry+1rGzvrDJ6NbDzqqw18mro6zUtMLryOfPwqO6PC9wPgo8cD48L3A+CjxwcmUgY2xhc3M9"brush:java;">

第二步:ImageButton設置

源碼如下:

 

    
其中:第一個ImageButton通過設置android:layout_alignParentTop這個屬性為true,從而達到與父控件頂端對齊的目的;第二個ImageButton通過設置android:layout_alignLeft="@+id/btnFacebook"從而達到與第一個ImageButton左邊對齊的目的;第一個ImageButton通過設置android:layout_centerHorizontal這個屬性為true,從而達到水平居中的目的。到現在為止,界面顯示效果如下:

\

第三步:TextView設置

拖五個TextView控件到布局當中去,然後將需要顯示的不同的文本保存在res/values/strings.xml文件當中,源碼如下:



    LoginLayout
    Facebook
    LinkedIn
    To use Highlight, please sign in with one of the services below:
    Why not email?
    Highlight is based on real identity and mutual friends. 
        Using these services allows us to show you how you are connected to the people around you. 
        It also makes it super easy to create a Highlight profile.
    
    
    
    
    We will not post things without your permission.

然後給相應的TextView設置上相應的顯示文本,並做一下基本的屬性的設置,整個布局文件的源碼如下:



    
      


    


    


    


    


    


    
    

做完了這些設置,界面效果如下:

\

第四步:let us know超鏈接設置

源碼如下:

public class MainActivity extends Activity
{
    TextView mTVFeedBack;
    
    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mTVFeedBack = (TextView)findViewById(R.id.textView4);
        mTVFeedBack.setText(Html.fromHtml(getString(R.string.feedback_label)));
        
    }
}
最終的UI效果如圖所示:


三、Demo下載地址:

Demo可以從以下地址下載:http://download.csdn.net/detail/kongre/7299753

  1. 上一頁:
  2. 下一頁:
熱門文章
閱讀排行版
Copyright © Android教程網 All Rights Reserved