欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Android UI設(shè)計與開發(fā)之仿人人網(wǎng)V5.9.2最新版引導(dǎo)界面

 更新時間:2017年08月30日 14:40:54   作者:yangyu20121224  
這篇文章主要為大家詳細(xì)介紹了Android UI設(shè)計與開發(fā)之仿人人網(wǎng)V5.9.2最新版引導(dǎo)界面,具有一定的參考價值,感興趣的小伙伴們可以參考一下

這一篇我將會以人人網(wǎng)的引導(dǎo)界面為實例來展開詳細(xì)的講解,人人網(wǎng)的引導(dǎo)界面比較的新穎,不同于其他應(yīng)用程序千篇一律的靠滑動來引導(dǎo)用戶,而是以一個一個比較生動形象的動畫效果展示在用戶們的面前,有一種給人眼前一亮的感覺,話不多說,進(jìn)入正題。

一、實現(xiàn)的效果圖

歡迎界面:

引導(dǎo)界面1

引導(dǎo)界面 2

引導(dǎo)界面 3

二 、項目的目錄結(jié)構(gòu)

三、具體的編碼實現(xiàn)

1、歡迎界面的xml布局,activity_welcome:

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
 android:layout_width="fill_parent" 
 android:layout_height="fill_parent" 
 android:background="@drawable/v5_6_2_welcome" 
 android:orientation="vertical" /> 

2、引導(dǎo)界面的xml布局,activity_guide.xml:

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
 android:layout_width="fill_parent" 
 android:layout_height="fill_parent" 
 android:orientation="vertical" > 
 
 <ImageView 
  android:id="@+id/iv_guide_picture" 
  android:layout_width="fill_parent" 
  android:layout_height="fill_parent" 
  android:layout_weight="1.0" 
  android:scaleType="fitXY" /> 
 
 <LinearLayout 
  android:id="@+id/ll_bottom_action_bar" 
  android:layout_width="fill_parent" 
  android:layout_height="wrap_content" 
  android:layout_alignParentBottom="true" 
  android:orientation="horizontal" 
  android:padding="7dip" > 
 
  <Button 
   android:id="@+id/btn_register" 
   android:layout_width="fill_parent" 
   android:layout_height="45dip" 
   android:layout_weight="1.5" 
   android:background="@drawable/guide_btn_blue" 
   android:gravity="center" 
   android:singleLine="true" 
   android:text="注 冊" 
   android:textColor="#FFFFFF" 
   android:textSize="15.0sp" /> 
 
  <Button 
   android:id="@+id/btn_look_at_the_people_i_know" 
   android:layout_width="fill_parent" 
   android:layout_height="45dip" 
   android:layout_marginLeft="8dip" 
   android:layout_marginRight="8dip" 
   android:layout_weight="1.0" 
   android:background="@drawable/guide_btn_white" 
   android:gravity="center" 
   android:singleLine="true" 
   android:text="看看我認(rèn)識的人" 
   android:textColor="#000000" 
   android:textSize="15.0sp" /> 
 
  <Button 
   android:id="@+id/btn_login" 
   android:layout_width="fill_parent" 
   android:layout_height="45dip" 
   android:layout_weight="1.5" 
   android:background="@drawable/guide_btn_blue" 
   android:gravity="center" 
   android:singleLine="true" 
   android:text="登 錄" 
   android:textColor="#FFFFFF" 
   android:textSize="15.0sp" /> 
 </LinearLayout> 
</RelativeLayout> 

3、在這里還要創(chuàng)建兩個xml資源文件文件來實現(xiàn)自定義按鈕的效果,關(guān)于自定義按鈕的效果實現(xiàn)我會在后面的UI專題詳細(xì)介紹,這里就不在贅述,guide_btn_blue.xml:

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
 
 <item android:drawable="@drawable/v5_0_1_guide_blue_default" android:state_focused="true" android:state_pressed="false"/> 
 <item android:drawable="@drawable/v5_0_1_guide_blue_press" android:state_pressed="true"/> 
 <item android:drawable="@drawable/v5_0_1_guide_blue_default"/> 
 
</selector> 

guide_btn_white:

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
 
 <item android:drawable="@drawable/v5_0_1_guide_black_default" android:state_focused="true" android:state_pressed="false"/> 
 <item android:drawable="@drawable/v5_0_1_guide_black_press" android:state_pressed="true"/> 
 <item android:drawable="@drawable/v5_0_1_guide_black_default"/> 
 
</selector>

  4、然后是動畫效果的xml資源文件,關(guān)于自定義動畫效果的實現(xiàn)我也會在后面的UI專題中詳細(xì)介紹,這里也就不再贅述漸入動畫資源文件,guide_fade_in.xml:

<?xml version="1.0" encoding="utf-8"?> 
<set xmlns:android="http://schemas.android.com/apk/res/android" > 
  
 <alpha android:fromAlpha="0.0" 
   android:toAlpha="1.0" /> 
 
</set>

 漸隱動畫資源文件,guide_fade_out.xml:

<?xml version="1.0" encoding="utf-8"?> 
<set xmlns:android="http://schemas.android.com/apk/res/android" > 
 
 <scale 
  android:fillAfter="false" 
  android:fromXScale="1.1" 
  android:fromYScale="1.1" 
  android:interpolator="@android:anim/decelerate_interpolator" 
  android:pivotX="50.0%" 
  android:pivotY="50.0%" 
  android:toXScale="1.1" 
  android:toYScale="1.1" /> 
 
 <alpha 
  xmlns:android="http://schemas.android.com/apk/res/android" 
  android:fromAlpha="1.0" 
  android:toAlpha="0.0" /> 
 
</set> 

放大動畫資源文件,guide_fade_in_scale:

<?xml version="1.0" encoding="utf-8"?> 
<set xmlns:android="http://schemas.android.com/apk/res/android" > 
 
 <scale 
  android:fillAfter="false" 
  android:fromXScale="1.0" 
  android:fromYScale="1.0" 
  android:interpolator="@android:anim/decelerate_interpolator" 
  android:pivotX="50.0%" 
  android:pivotY="50.0%" 
  android:toXScale="1.1" 
  android:toYScale="1.1"/> 
 
</set> 

5、開始啟動的歡迎界WelcomeActivity.java:

package com.yangyu.myguideview03; 
 
import android.app.Activity; 
import android.content.Intent; 
import android.os.Bundle; 
import android.os.CountDownTimer; 
 
/** 
 * @author yangyu 
 * 功能描述:歡迎界面Activity(Logo) 
 */ 
public class WelcomeActivity extends Activity { 
 
 @Override 
 public void onCreate(Bundle savedInstanceState) { 
  super.onCreate(savedInstanceState); 
  setContentView(R.layout.activity_welcome); 
 
  /** 
   * millisInFuture:從開始調(diào)用start()到倒計時完成并onFinish()方法被調(diào)用的毫秒數(shù) 
   * countDownInterval:接收onTick(long)回調(diào)的間隔時間 
   */ 
  new CountDownTimer(5000, 1000) { 
   @Override 
   public void onTick(long millisUntilFinished) { 
   } 
 
   @Override 
   public void onFinish() { 
    Intent intent = new Intent(WelcomeActivity.this, GuideActivity.class); 
    startActivity(intent); 
    WelcomeActivity.this.finish(); 
   } 
  }.start(); 
 } 
}

6、引導(dǎo)界面,GuideActivity.java:

package com.yangyu.myguideview03; 
 
import android.app.Activity; 
import android.graphics.drawable.Drawable; 
import android.os.Bundle; 
import android.view.View; 
import android.view.View.OnClickListener; 
import android.view.animation.Animation; 
import android.view.animation.Animation.AnimationListener; 
import android.view.animation.AnimationUtils; 
import android.widget.Button; 
import android.widget.ImageView; 
import android.widget.Toast; 
 
/** 
 * @author yangyu 
 * 功能描述:導(dǎo)引界面(每張圖片都執(zhí)行的動畫順序,漸現(xiàn)、放大和漸隱,結(jié)束后切換圖片和文字 
 * 又開始執(zhí)行 漸現(xiàn)、放大和漸隱,當(dāng)最后一張執(zhí)行完漸隱,切換到第一張,從而達(dá)到循環(huán)效果) 
 */ 
public class GuideActivity extends Activity implements OnClickListener{ 
 //定義注冊、登錄和看看我認(rèn)識的人按鈕 
 private Button btnRegister,btnLogin,btnIKnowPeople; 
  
 //顯示圖片的ImageView組件 
 private ImageView ivGuidePicture; 
  
 //要展示的一組圖片資源 
 private Drawable[] pictures; 
  
 //每張展示圖片要執(zhí)行的一組動畫效果 
 private Animation[] animations; 
  
 //當(dāng)前執(zhí)行的是第幾張圖片(資源索引) 
 private int currentItem = 0; 
  
 @Override 
 protected void onCreate(Bundle savedInstanceState) { 
  super.onCreate(savedInstanceState); 
  setContentView(R.layout.activity_guide); 
   
  initView(); 
   
  initData(); 
 } 
 
 /** 
  * 初始化組件 
  */ 
 private void initView(){ 
  //實例化ImageView引導(dǎo)圖片 
  ivGuidePicture = (ImageView) findViewById(R.id.iv_guide_picture); 
   
  //實例化按鈕 
  btnRegister = (Button) findViewById(R.id.btn_register); 
  btnIKnowPeople = (Button) findViewById(R.id.btn_look_at_the_people_i_know); 
  btnLogin = (Button) findViewById(R.id.btn_login); 
 
  //實例化引導(dǎo)圖片數(shù)組 
  pictures = new Drawable[] { getResources().getDrawable(R.drawable.v5_3_0_guide_pic1),getResources().getDrawable(R.drawable.v5_3_0_guide_pic2), 
         getResources().getDrawable(R.drawable.v5_3_0_guide_pic3)}; 
 
  //實例化動畫效果數(shù)組 
  animations = new Animation[] { AnimationUtils.loadAnimation(this, R.anim.guide_fade_in), 
          AnimationUtils.loadAnimation(this, R.anim.guide_fade_in_scale), 
          AnimationUtils.loadAnimation(this, R.anim.guide_fade_out) }; 
 } 
 
 /** 
  * 初始化數(shù)據(jù) 
  */ 
 private void initData(){ 
  //給按鈕設(shè)置監(jiān)聽 
  btnRegister.setOnClickListener(this); 
  btnIKnowPeople.setOnClickListener(this); 
  btnLogin.setOnClickListener(this); 
      
  //給每個動畫效果設(shè)置播放時間 
  animations[0].setDuration(1500); 
  animations[1].setDuration(3000); 
  animations[2].setDuration(1500); 
 
  //給每個動畫效果設(shè)置監(jiān)聽事件 
  animations[0].setAnimationListener(new GuideAnimationListener(0)); 
  animations[1].setAnimationListener(new GuideAnimationListener(1)); 
  animations[2].setAnimationListener(new GuideAnimationListener(2)); 
   
  //設(shè)置圖片動畫初始化默認(rèn)值為0 
  ivGuidePicture.setImageDrawable(pictures[currentItem]); 
  ivGuidePicture.startAnimation(animations[0]); 
 } 
 
 /** 
  * 實現(xiàn)了動畫監(jiān)聽接口,重寫里面的方法 
  */ 
 class GuideAnimationListener implements AnimationListener {    
  private int index; 
 
  public GuideAnimationListener(int index) { 
   this.index = index; 
  } 
 
  @Override 
  public void onAnimationStart(Animation animation) { 
  } 
   
  //重寫動畫結(jié)束時的監(jiān)聽事件,實現(xiàn)了動畫循環(huán)播放的效果 
  @Override 
  public void onAnimationEnd(Animation animation) { 
   if (index < (animations.length - 1)) { 
    ivGuidePicture.startAnimation(animations[index + 1]); 
   } else { 
    currentItem++; 
    if (currentItem > (pictures.length - 1)) { 
     currentItem = 0; 
    } 
    ivGuidePicture.setImageDrawable(pictures[currentItem]); 
    ivGuidePicture.startAnimation(animations[0]); 
   } 
  } 
 
  @Override 
  public void onAnimationRepeat(Animation animation) { 
 
  } 
 
 } 
  
 @Override 
 public void onClick(View v) { 
   switch (v.getId()) { 
   case R.id.btn_register: 
    Toast.makeText(this, "點擊了注冊按鈕", Toast.LENGTH_SHORT).show(); 
    break; 
   case R.id.btn_look_at_the_people_i_know: 
    Toast.makeText(this, "點擊了我認(rèn)識的人按鈕", Toast.LENGTH_SHORT).show(); 
    break; 
   case R.id.btn_login:  
    Toast.makeText(this, "點擊了登錄按鈕", Toast.LENGTH_SHORT).show(); 
    break; 
   default: 
    break; 
   } 
 } 
} 

下一篇將會對整個引導(dǎo)界面的開發(fā)專題做一個完結(jié)篇,敬請期待。

以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。

相關(guān)文章

  • Android開發(fā)中遇到端口號占用問題解決方法

    Android開發(fā)中遇到端口號占用問題解決方法

    這篇文章主要介紹了Android開發(fā)中遇到端口號占用問題解決方法,本文給出了一個簡潔實用的方法來解決這個煩人的問題,需要的朋友可以參考下
    2015-06-06
  • Android開發(fā)使用Message對象分發(fā)必備知識點詳解

    Android開發(fā)使用Message對象分發(fā)必備知識點詳解

    這篇文章主要為大家介紹了Android開發(fā)使用Message對象分發(fā)必備知識點詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
    2022-10-10
  • Android防止按鈕重復(fù)點擊示例代碼

    Android防止按鈕重復(fù)點擊示例代碼

    本文介紹封裝的一個小的工具類庫,按鈕點擊事件類庫,該類庫可以防止按鈕重復(fù)點擊,可以判斷網(wǎng)絡(luò)狀態(tài),可以判斷用戶登錄態(tài),以及自定義驗證條件等等,有興趣的可以了解一下
    2018-05-05
  • Android側(cè)滑菜單控件DrawerLayout使用詳解

    Android側(cè)滑菜單控件DrawerLayout使用詳解

    這篇文章主要為大家詳細(xì)介紹了Android側(cè)滑菜單控件DrawerLayout的使用,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2017-12-12
  • Android開發(fā)自學(xué)筆記(四):APP布局下

    Android開發(fā)自學(xué)筆記(四):APP布局下

    這篇文章主要介紹了Android開發(fā)自學(xué)筆記(四):APP布局下,本文是上一篇的補(bǔ)充,需要的朋友可以參考下
    2015-04-04
  • ViewPager實現(xiàn)輪播圖引導(dǎo)頁

    ViewPager實現(xiàn)輪播圖引導(dǎo)頁

    這篇文章主要為大家詳細(xì)介紹了ViewPager實現(xiàn)輪播圖引導(dǎo)頁,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2022-09-09
  • Android:Field can be converted to a local varible.的解決辦法

    Android:Field can be converted to a local varible.的解決辦法

    這篇文章主要介紹了Android:Field can be converted to a local varible.的解決辦法的相關(guān)資料,希望通過本文能幫助到大家,讓大家遇到這樣的問題輕松解決,需要的朋友可以參考下
    2017-10-10
  • Android自定義View實現(xiàn)角度選擇器

    Android自定義View實現(xiàn)角度選擇器

    前幾天在Google Photos查看照片,用了一下它的圖片剪裁功能,于是我馬上就被其界面和操作吸引。后來想模仿做一個和Google Photos裁圖頁面幾乎一模一樣的角度選擇器,本文比較基礎(chǔ),在閱讀本文前只需要掌握最基礎(chǔ)的自定義View知識和Android事件知識。下面來一起學(xué)習(xí)下吧。
    2016-11-11
  • Android GPS定位測試(附效果圖和示例)

    Android GPS定位測試(附效果圖和示例)

    本人做了GPS相關(guān)的嵌入式軟件已經(jīng)幾年了,所以說起要做個測試GPS定位模塊的程序,第一反應(yīng)就是串口讀取GPS模塊的數(shù)據(jù),然后解析GPS的NMEA格式數(shù)據(jù)
    2013-07-07
  • Android仿網(wǎng)易客戶端頂部導(dǎo)航欄效果

    Android仿網(wǎng)易客戶端頂部導(dǎo)航欄效果

    這篇文章主要為大家詳細(xì)介紹了Android仿網(wǎng)易客戶端頂部導(dǎo)航欄效果,幫助大家制作網(wǎng)易客戶端導(dǎo)航欄特效,感興趣的小伙伴們可以參考一下
    2016-06-06

最新評論