Android應(yīng)用中圖片瀏覽時(shí)實(shí)現(xiàn)自動(dòng)切換功能的方法詳解
更新時(shí)間：2016年04月07日 18:31:38 作者：chenzheng_java
這篇文章主要介紹了Android應(yīng)用中圖片瀏覽時(shí)實(shí)現(xiàn)自動(dòng)切換功能的方法,文中還講解了一個(gè)觸摸大圖進(jìn)行圖片切換的深入功能,需要的朋友可以參考下
先給最終效果圖：
當(dāng)我們?cè)谧钕逻叺膅allery中切換圖片時(shí)，上面的大圖片會(huì)自動(dòng)切換，切換時(shí)有動(dòng)畫效果哦，很簡(jiǎn)單的一個(gè)程序，有待完善更多的功能！
activity代碼：
package cn.com.chenzheng_java;
import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.view.Window;
import android.view.animation.AnimationUtils;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.Gallery;
import android.widget.ImageSwitcher;
import android.widget.ImageView;
import android.widget.Toast;
import android.widget.AdapterView.OnItemSelectedListener;
import android.widget.ImageView.ScaleType;
import android.widget.ViewSwitcher.ViewFactory;
public class GalleryActivity extends Activity implements OnItemSelectedListener {
int[] imagesId = new int[] { R.drawable.a1, R.drawable.a2, R.drawable.a3,
R.drawable.a4
};
int index = R.drawable.a1;
ImageSwitcher imageSwitcher;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
/**
* 設(shè)置窗口無(wú)標(biāo)題欄,一定要在setContentView前進(jìn)行設(shè)置哦
*/
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.gallery);
Gallery gallery = (Gallery) findViewById(R.id.gallery1);
gallery.setOnItemSelectedListener(this);
imageSwitcher = (ImageSwitcher) findViewById(R.id.imageSwitcher);
imageSwitcher.setVisibility(View.VISIBLE);
/***
* setInAnimation可以設(shè)置淡入動(dòng)畫
* setOutAnimation可以設(shè)置淡出動(dòng)畫
*/
imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(
getApplicationContext(), android.R.anim.fade_in));
imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(
getApplicationContext(), android.R.anim.fade_out));
imageSwitcher.setFactory(new ViewFactory() {
/**
* 創(chuàng)建一個(gè)新的圖片放置到ImageSwitcher上,可以使用其設(shè)置背景哦。
* 一般只會(huì)在創(chuàng)建時(shí)調(diào)用一次。相當(dāng)于為我們創(chuàng)建一個(gè)進(jìn)行動(dòng)畫效果時(shí)的一個(gè)背景圖。
* 此方法亦可以通過setView替代
*/
@Override
public View makeView() {
ImageView imageView = new ImageView(GalleryActivity.this);
// 設(shè)置截取模式
imageView.setScaleType(ScaleType.CENTER_INSIDE);
imageView.setBackgroundResource(R.drawable.ground);
Toast.makeText(getApplicationContext(), "執(zhí)行了一次",
Toast.LENGTH_SHORT).show();
return imageView;
}
});
gallery.setVisibility(View.VISIBLE);
gallery.setAdapter(new ImageAdapter(this));
}
class ImageAdapter extends BaseAdapter {
private Context context2;
public ImageAdapter(Context context) {
context2 = context;
}
@Override
public int getCount() {
return imagesId.length;
}
@Override
public Object getItem(int position) {
return imagesId[position];
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(int position, View image2, ViewGroup parent) {
ImageView image = new ImageView(context2);
image.setBackgroundResource(imagesId[position]);
/**
* setScaleType()可以設(shè)置當(dāng)圖片大小和容器大小不匹配時(shí)的剪輯模式.
* ScaleType.CENTER_INSIDE的意思是，按圖片的原比例縮小或者擴(kuò)大，直到長(zhǎng)或者寬中的任何一個(gè)頂?shù)饺萜鳛橹?
*/
image.setScaleType(ScaleType.CENTER_INSIDE);
return image;
}
}
/**
* 當(dāng)gallery的圖像發(fā)生變化時(shí)，同步ImageSwitcher的變化
*/
@Override
public void onItemSelected(AdapterView<?> parent, View view, int position,
long id) {
imageSwitcher.setImageResource(imagesId[position]);
}
@Override
public void onNothingSelected(AdapterView<?> parent) {
}
}
gallery.xml
<?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:orientation="vertical" android:gravity="center_horizontal" > <ImageSwitcher android:id="@+id/imageSwitcher" android:layout_height="350dp" android:layout_width="fill_parent" ></ImageSwitcher> <Gallery android:id="@+id/gallery1" android:gravity="center" android:layout_width="70dp" android:layout_height="100dp"></Gallery> </LinearLayout>
升級(jí)版
較之上面的，效果還是一樣的，只不過這里添加了這么以下幾個(gè)功能：
第一：下方圖片的自適應(yīng)長(zhǎng)寬（在保證長(zhǎng)寬比例的情況下哦）
第二：觸摸大圖同樣可以進(jìn)行圖片切換（沒有機(jī)器，沒法測(cè)試，但是基本的思路還是正確的）
代碼：
activity代碼：
package cn.com.chenzheng_java;
import java.text.DecimalFormat;
import android.app.Activity;
import android.content.Context;
import android.content.res.Resources;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.os.Bundle;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.view.Window;
import android.view.View.OnTouchListener;
import android.view.animation.AnimationUtils;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.Gallery;
import android.widget.ImageSwitcher;
import android.widget.ImageView;
import android.widget.Toast;
import android.widget.AdapterView.OnItemSelectedListener;
import android.widget.Gallery.LayoutParams;
import android.widget.ImageView.ScaleType;
import android.widget.ViewSwitcher.ViewFactory;
public class GalleryActivity extends Activity implements OnItemSelectedListener ,OnTouchListener{
int[] imagesId = new int[] { R.drawable.a1, R.drawable.a2, R.drawable.a3,
R.drawable.a4
};
int index = 0;
ImageSwitcher imageSwitcher;
int maxImageWidth = 70;
int maxImageHeight = 100;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
/**
* 設(shè)置窗口無(wú)標(biāo)題欄,一定要在setContentView前進(jìn)行設(shè)置哦
*/
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.gallery);
Gallery gallery = (Gallery) findViewById(R.id.gallery1);
gallery.setOnItemSelectedListener(this);
imageSwitcher = (ImageSwitcher) findViewById(R.id.imageSwitcher);
imageSwitcher.setVisibility(View.VISIBLE);
/***
* setInAnimation可以設(shè)置淡入動(dòng)畫
* setOutAnimation可以設(shè)置淡出動(dòng)畫
*/
imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(
getApplicationContext(), android.R.anim.fade_in));
imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(
getApplicationContext(), android.R.anim.fade_out));
imageSwitcher.setFactory(new ViewFactory() {
/**
* 創(chuàng)建一個(gè)新的圖片放置到ImageSwitcher上,可以使用其設(shè)置背景哦。
* 一般只會(huì)在創(chuàng)建時(shí)調(diào)用一次。相當(dāng)于為我們創(chuàng)建一個(gè)進(jìn)行動(dòng)畫效果時(shí)的一個(gè)背景圖。
* 此方法亦可以通過setView替代
*/
@Override
public View makeView() {
ImageView imageView = new ImageView(GalleryActivity.this);
// 設(shè)置截取模式
imageView.setScaleType(ScaleType.CENTER_INSIDE);
imageView.setBackgroundResource(R.drawable.ground);
Toast.makeText(getApplicationContext(), "執(zhí)行了一次",
Toast.LENGTH_SHORT).show();
return imageView;
}
});
gallery.setVisibility(View.VISIBLE);
gallery.setAdapter(new ImageAdapter(this));
}
class ImageAdapter extends BaseAdapter {
private Context context2;
public ImageAdapter(Context context) {
context2 = context;
}
@Override
public int getCount() {
return imagesId.length;
}
@Override
public Object getItem(int position) {
return imagesId[position];
}
@Override
public long getItemId(int position) {
return position;
}
/***
* 該方法的實(shí)現(xiàn)稍微復(fù)雜一些，主要思想就是，要對(duì)圖片的大小進(jìn)行自動(dòng)剪裁，讓其正好寬或者長(zhǎng)頂?shù)皆试S的最大值
* 這里主要用到了BitmapFactory Bitmap 用于圖片獲取和處理
* DecaimalFormat 用于對(duì)double數(shù)據(jù)進(jìn)行格式規(guī)劃（這里是只允許小數(shù)點(diǎn)后兩位）
*/
@Override
public View getView(int position, View convertView, ViewGroup parent) {
index = position;
ImageView image = new ImageView(context2);
Resources resources = context2.getResources();
// 加載圖片為Bitmap位圖
Bitmap bitmap = BitmapFactory.decodeResource(resources, imagesId[position]);
Log.i("是否可以decode這張圖片", (bitmap!=null)+"");
// 圖片的原始大小
int bitMapWidth = bitmap.getWidth();
int bitMapHeight = bitmap.getHeight();
Log.i("bitMapWidth", bitMapWidth+"");
Log.i("bitMapHeight", bitMapHeight+"");
// 縮小或者放大的倍數(shù)關(guān)系
double scale;
double widthScale = (maxImageWidth*100)/(bitMapWidth*100.0);//這里乘以100然后除以100.0的目的是為了讓其返回double類型
double heightScale = (maxImageHeight*100)/(bitMapHeight*100.0);
// 規(guī)劃獲得的格式（小數(shù)點(diǎn)后兩位）
DecimalFormat decimalFormat = new DecimalFormat("#.00");
widthScale = Double.valueOf(decimalFormat.format(widthScale));
heightScale = Double.valueOf(decimalFormat.format(heightScale));
Log.i("widthScale", widthScale+"");
Log.i("heightScale", heightScale+"");
if(widthScale>= heightScale){
scale = widthScale;
}
else{
scale = heightScale;
}
Log.i("scale", scale+"");
// 根據(jù)原圖片生成一個(gè)縮放后的圖片
Bitmap bitmap2 = Bitmap.createScaledBitmap(bitmap, (int)(bitMapWidth*scale), (int)(bitMapHeight*scale), true);
// 將圖片綁定到ImageView
image.setImageBitmap(bitmap2);
/**
* setScaleType()可以設(shè)置當(dāng)圖片大小和容器大小不匹配時(shí)的剪輯模式.
* ScaleType.CENTER_INSIDE的意思是，按圖片的原比例縮小或者擴(kuò)大，直到長(zhǎng)或者寬中的任何一個(gè)頂?shù)饺萜鳛橹?
* 因?yàn)樵谏厦嫖覀円呀?jīng)重新生成了一個(gè)圖片放在gallery上，大小已經(jīng)符合要求了，所以這里就不需要再通過
* setScaleType進(jìn)行剪裁了。有些人可能覺得筆者腦子有病，有簡(jiǎn)單的不用，非要用那么復(fù)雜的，這里呢，其實(shí)只是
* 給大家的一個(gè)使用范例，我們通過bitmap可不僅僅是縮放圖片哦，還可以傾斜、移動(dòng)等等……
*/
// image.setScaleType(ScaleType.CENTER_INSIDE);
image.setAdjustViewBounds(true);// 自適應(yīng)邊框處理
image.setLayoutParams(new Gallery.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
return image;
}
}
/**
* 當(dāng)gallery的圖像發(fā)生變化時(shí)，同步ImageSwitcher的變化
*/
@Override
public void onItemSelected(AdapterView<?> parent, View view, int position,
long id) {
imageSwitcher.setImageResource(imagesId[position]);
}
@Override
public void onNothingSelected(AdapterView<?> parent) {
}
int i = 0 ;
/***
* 屏幕被觸摸時(shí)提供的方法,這里我們通過它來(lái)實(shí)現(xiàn)拖動(dòng)大圖片，也會(huì)自動(dòng)切換圖片o
*/
@Override
public boolean onTouch(View v, MotionEvent event) {
Log.i("是否正在觸摸", "yes");
int actionName = event.getAction();
float []position = null;
//被按下時(shí)
if(actionName==MotionEvent.ACTION_DOWN){
i = 0;
}
// 被按著拖動(dòng)時(shí)
if(actionName == MotionEvent.ACTION_MOVE)
{
position[i] = event.getX();
++i;
}
if(actionName == MotionEvent.ACTION_UP)
{
if(position[position.length]>position[position.length-1]){
if((index+1)>imagesId.length){
imageSwitcher.setImageResource(imagesId[index]);
}
else{
imageSwitcher.setImageResource(imagesId[index+1]);
}
}
else{
if((index-1)<0){
imageSwitcher.setImageResource(imagesId[0]);
}
else{
imageSwitcher.setImageResource(imagesId[index-1]);
}
}
}
return true;
}
}
gallery.xml
<?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:orientation="vertical" android:gravity="center_horizontal" > <ImageSwitcher android:id="@+id/imageSwitcher" android:layout_height="350dp" android:layout_width="fill_parent" ></ImageSwitcher> <Gallery android:id="@+id/gallery1" android:gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content"></Gallery> </LinearLayout>
您可能感興趣的文章:
- Android開發(fā)之使用ViewPager實(shí)現(xiàn)圖片左右滑動(dòng)切換效果
- Android自定義ImageView實(shí)現(xiàn)點(diǎn)擊兩張圖片切換效果
- Android編程單擊圖片實(shí)現(xiàn)切換效果的方法
- Android中ViewPager組件的基本用法及實(shí)現(xiàn)圖片切換的示例
- Android實(shí)現(xiàn)圖片輪播切換實(shí)例代碼
- Android點(diǎn)擊Button實(shí)現(xiàn)切換點(diǎn)擊圖片效果的示例
- Android編程實(shí)現(xiàn)圖片背景漸變切換與圖層疊加效果
- Android 圖片切換器（dp、sp、px） 的單位轉(zhuǎn)換器
- Android實(shí)現(xiàn)滑動(dòng)屏幕切換圖片
- android使用ViewPager實(shí)現(xiàn)圖片自動(dòng)切換
相關(guān)文章
Android開發(fā)Kotlin語(yǔ)言協(xié)程的依賴及使用示例
這篇文章主要為大家介紹了Android開發(fā)Kotlin語(yǔ)言協(xié)程的依賴及使用示例解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-08-08
這篇文章主要為大家詳細(xì)介紹了Kotlin自定義菜單控件，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-07-07
Android自定義View實(shí)現(xiàn)仿網(wǎng)易音樂唱片播放效果
這篇文章主要為大家詳細(xì)介紹了Android自定義View實(shí)現(xiàn)仿網(wǎng)易音樂唱片播放效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-04-04
Android編程實(shí)現(xiàn)開始及停止service的方法
這篇文章主要介紹了Android編程實(shí)現(xiàn)開始及停止service的方法,涉及Android針對(duì)service的開始、停止、綁定等操作相關(guān)技巧與注意事項(xiàng),需要的朋友可以參考下2016-01-01
現(xiàn)在網(wǎng)絡(luò)的繁盛時(shí)代，光文字是不能滿足人們的胃口的，圖片，flash，音頻，視頻就成為瀏覽網(wǎng)頁(yè)的主流顯示，在手機(jī)上也一樣，本文將詳細(xì)介紹此功能的實(shí)現(xiàn)方法2012-11-11
Android實(shí)現(xiàn)快遞物流時(shí)間軸效果
這篇文章主要為大家詳細(xì)介紹了Android實(shí)現(xiàn)快遞物流時(shí)間軸效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-05-05
Android實(shí)現(xiàn)文字滾動(dòng)效果
這篇文章主要為大家詳細(xì)介紹了Android實(shí)現(xiàn)文字滾動(dòng)效果,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-11-11
Android中TabLayout結(jié)合ViewPager實(shí)現(xiàn)頁(yè)面切換效果
這篇文章主要介紹了Android中TabLayout結(jié)合ViewPager實(shí)現(xiàn)頁(yè)面切換效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-10-10
Android中ExpandableListView的用法實(shí)例
這篇文章主要介紹了Android中ExpandableListView的用法,以實(shí)例形式展示了Android中的下拉list控件的用法,需要的朋友可以參考下2014-10-10
android Retrofit2網(wǎng)絡(luò)請(qǐng)求封裝介紹
大家好，本篇文章主要講的是android Retrofit2網(wǎng)絡(luò)請(qǐng)求封裝介紹，感興趣的同學(xué)趕快來(lái)看一看吧，對(duì)你有幫助的話記得收藏一下，方便下次瀏覽2021-12-12