Android UI设计模式

移动开发 Android
UI设计则是指对软件的人机交互、操作逻辑、界面美观的整体设计。好的UI设计不仅是让软件变得有个性有品味,还要让软件的操作变得舒适、简单、自由、充分体现软件的定位和特点。

home.xml

  1. <?xml version="1.0" encoding="utf-8"?> 
  2. <merge xmlns:android="http://schemas.android.com/apk/res/android">     
  3.   <include  layout="@layout/background" /> 
  4.      <LinearLayout 
  5.         android:orientation="vertical" 
  6.         android:layout_width="fill_parent" 
  7.         android:layout_height="fill_parent"> 
  8.      <include layout="@layout/navigator" /> 
  9.   <include layout="@layout/list" 
  10.      android:layout_width="fill_parent" 
  11.      android:layout_height="fill_parent" 
  12.      android:layout_weight="1.0" /> 
  13.   <include layout="@layout/tab" /> 
  14.  </LinearLayout> 
  15. </merge> 

background.xml

  1. <?xml version="1.0" encoding="utf-8"?> 
  2.     <ImageView xmlns:android="http://schemas.android.com/apk/res/android" 
  3.     android:id="@+id/background" 
  4.     android:layout_width="fill_parent" 
  5.     android:layout_height="fill_parent" 
  6.     android:scaleType="fitXY" 
  7.     android:background="@color/background"   
  8. /> 

navigator.xml

  1. <?xml version="1.0" encoding="utf-8"?> 
  2.    <RelativeLayout 
  3.       android:layout_width="fill_parent" 
  4.       android:layout_height="64dp" 
  5.       android:gravity="center_vertical"   
  6.       style="@android:style/ButtonBar"> 
  7.  <Button    
  8.       android:id="@+id/button_back"   
  9.       android:layout_width="wrap_content" 
  10.       android:layout_height="40dp" 
  11.       android:text="@string/back" /> 
  12.  <Button   
  13.       android:id="@+id/button_home"   
  14.       android:layout_width="wrap_content" 
  15.       android:layout_height="40dp" 
  16.       android:layout_alignParentRight="true" />   
  17. <TextView    
  18.       android:id="@android:id/title"   
  19.       android:layout_width="fill_parent"   
  20.       android:layout_height="wrap_content" 
  21.       android:layout_toRightOf="@id/button_back" 
  22.       android:layout_toLeftOf="@id/button_home" 
  23.       android:gravity="center" 
  24.       android:singleLine="true" 
  25.       android:ellipsize="marquee" 
  26.       android:textAppearance="?android:attr/textAppearanceMedium" />      
  27. </RelativeLayout> 

list.xml

 

tab.xml

  1. <?xml version="1.0" encoding="utf-8"?> 
  2. <LinearLayout   
  3.    xmlns:android="http://schemas.android.com/apk/res/android"   
  4.    android:layout_width="fill_parent"   
  5.    android:layout_height="?android:attr/listPreferredItemHeight"> 
  6. <ImageButton    
  7.    android:id="@+id/tab_profile" 
  8.    android:layout_width="wrap_content"   
  9.    android:layout_height="wrap_content" 
  10.    android:src="@drawable/tab_profile" 
  11.    android:layout_weight="1.0" 
  12.    android:background="@drawable/bg_btn" />   
  13. <ImageButton   
  14.    android:id="@+id/tab_friends" 
  15.    android:layout_width="wrap_content" 
  16.    android:layout_height="wrap_content" 
  17.    android:layout_weight="1.0" 
  18.    android:src="@drawable/tab_friends" 
  19.    android:background="@drawable/bg_btn" /> 
  20. <ImageButton   
  21.   android:id="@+id/tab_games"   
  22.   android:layout_width="wrap_content" 
  23.   android:layout_height="wrap_content" 
  24.   android:layout_weight="1.0" 
  25.   android:src="@drawable/tab_games"   
  26.   android:background="@drawable/bg_btn" /> 
  27. </LinearLayout> 

【编辑推荐】

谷歌Android UI设计技巧:框架特性

谷歌Android UI设计技巧:新的UI设计模式

谷歌Android UI设计技巧:优秀UI设计准则

责任编辑:zhaolei 来源: 网络转载
相关推荐

2011-05-28 15:14:06

设计技巧UIAndroid

2011-09-14 10:29:23

Android UI设

2012-03-01 20:14:25

Android UI

2011-05-28 12:19:33

设计技巧UIAndroid

2013-11-26 16:09:34

Android设计模式

2013-11-26 15:48:53

Android设计模式SDK

2010-02-04 13:30:49

Android UI元

2013-11-26 17:00:08

Android设计模式

2013-11-26 17:15:13

Android设计模式

2013-11-26 16:20:26

Android设计模式

2016-03-28 10:23:11

Android设计单例

2011-05-28 14:25:57

设计技巧UIAndroid

2011-09-13 16:39:50

Android UI设

2013-11-26 16:29:22

Android设计模式

2013-11-26 16:39:21

Android设计模式

2013-11-26 17:09:57

Android设计模式

2013-11-26 15:44:25

2010-09-14 09:38:48

AndroidUI

2010-09-02 14:47:40

UIAndroid

2010-12-12 09:40:00

Android UI设
点赞
收藏

51CTO技术栈公众号