本軟件設(shè)定用戶第一個接觸到的功能就是頁面載入等待功能,,這個功能對使用者來說就是一個持續(xù)1、2秒鐘的等待頁面,,在用戶等待的同時程序做一些必要的檢查以及數(shù)據(jù)準備工作,載入頁面分為UI篇和功能篇,,從表及里首先是UI的實現(xiàn),,一個軟件除功能之外還得有一個光鮮的外表也是非常重要的,盡管本人設(shè)計水平一般但是還是親自操刀用ps先做了一下設(shè)計效果圖如下:
一,、接下來的任務(wù)就是在android中實現(xiàn)這樣的效果顯示,,從這個效果的設(shè)計分別把圖片分成背景、版本號部分,、軟件名稱和圖標(biāo),、作者名稱和blog四個部分,按照這樣的思路把分別生成4張png的圖片,,背景部分考慮實現(xiàn)橫屏和豎屏切換額外添加一張橫屏背景圖,,然后新建android工程,我這里的名稱為MySinaWeibo,android版本勾選2.2,并且創(chuàng)建名為MainActivity的Activity作為整個軟件的起始頁面,,然后把上面的這些圖片保存到項目的res/drawable-mdpi文件夾下,,關(guān)于res目錄下的drawable-mdpi、drawable-ldpi,,、drawable-hdpi三個文件夾的區(qū)別,mdpi 里面主要放中等分辨率的圖片,如HVGA (320x480),。ldpi里面主要放低分辨率的圖片,如QVGA (240x320)。hdpi里面主要放高分辨率的圖片,如WVGA (480x800),FWVGA (480x854),。android系統(tǒng)會根據(jù)機器的分辨率來分別到這幾個文件夾里面去找對應(yīng)的圖片,在開發(fā)程序時為了兼容不同平臺不同屏幕,,建議各自文件夾根據(jù)需求均存放不同版本圖片,我這里就不進行這么多的考慮了,。 二,、完成圖片資源的準備后接下就是layout文件的編寫, 在res/layout文件夾下新建main.xml文件,,這個layout采用LinearLayout控件作為頂層控件,然后用ImageView控件分別實現(xiàn)版本號圖片頂部靠左對齊顯示,、軟件名稱和圖標(biāo)圖片居中對齊,、作者名稱和blog圖片底部靠右對齊,。注意在版本號圖片顯示ImageView控件下面添加一個RelativeLayout控件作為軟件名稱和圖標(biāo)圖片ImageVIew和作者名稱和blog圖片ImageView的父控件用來控制居中對齊已經(jīng)底部對齊的實現(xiàn),具體代碼如下:代碼 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas./apk/res/android" android:id="@+id/layout" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/ver" android:layout_marginTop="15dip" android:layout_marginLeft="15dip"> </ImageView> <RelativeLayout android:layout_width="fill_parent" android:layout_height="fill_parent"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/logo" android:layout_centerInParent="true"> </ImageView> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/dev" android:layout_alignParentBottom="true" android:layout_alignParentRight="true" android:layout_marginRight="5dip" android:layout_marginBottom="35dip"> </ImageView> </RelativeLayout> </LinearLayout> 三、在ec打開名為MainActivity的Activity源代碼文件進行編輯,,onCreate部分代碼如下: public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); }
然后運行項目可以在模擬器中顯示,上面的幾個圖片都按照設(shè)計的位置和效果進行顯示只是整個頁面的背景還是黑色的,,接下來就是背景部分的顯示實現(xiàn),由于為了實現(xiàn)橫豎屏切換顯示,,背景圖的顯示采用代碼進行控制顯示,首先用如下方法獲取當(dāng)前手機是橫屏還是豎屏:
代碼
//獲取屏幕方向 public static int ScreenOrient(Activity activity) { int orient = activity.getRequestedOrientation(); if(orient != ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE && orient != ActivityInfo.SCREEN_ORIENTATION_PORTRAIT) { //寬>高為橫屏,反正為豎屏 WindowManager windowManager = activity.getWindowManager(); Display display = windowManager.getDefaultDisplay(); int screenWidth = display.getWidth(); int screenHeight = display.getHeight(); orient = screenWidth < screenHeight ? ActivityInfo.SCREEN_ORIENTATION_PORTRAIT : ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE; } return orient; }
然后編寫一個名為AutoBackground的公共方法用來實現(xiàn)屏幕背景的自動切換,,后面的幾乎每一個功能頁面都需要用到這個方法:
代碼
public static void AutoBackground(Activity activity,View view,int Background_v, int Background_h) { int orient=ScreenOrient(activity); if (orient == ActivityInfo.SCREEN_ORIENTATION_PORTRAIT) { //縱向 view.setBackgroundResource(Background_v); }else{ //橫向 view.setBackgroundResource(Background_h); } }
完成上述兩方法后在 MainActivity的onCreate方法中調(diào)用AutoBackground方法進行屏幕自動切換: LinearLayout layout=(LinearLayout)findViewById(R.id.layout); //背景自動適應(yīng) AndroidHelper.AutoBackground(this, layout, R.drawable.bg_v, R.drawable.bg_h);
到此完成了載入頁面的UI部分的實現(xiàn),,測試運行模擬器中查看效果,基本上跟最上面的設(shè)計效果圖相符,,測試效果圖如下:
|
|
來自: 昵稱QAb6ICvc > 《手機知識》