Android应用中图片浏览时实现自动切换功能的方法详解
先给最终效果图：
当我们在最下边的gallery中切换图片时，上面的大图片会自动切换，切换时有动画效果哦，很简单的一个程序，有待完善更多的功能！
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);
/**
* 设置窗口无标题栏,一定要在setContentView前进行设置哦
*/
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可以设置淡入动画
* setOutAnimation可以设置淡出动画
*/
imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(
getApplicationContext(), android.R.anim.fade_in));
imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(
getApplicationContext(), android.R.anim.fade_out));
imageSwitcher.setFactory(new ViewFactory() {
/**
* 创建一个新的图片放置到ImageSwitcher上,可以使用其设置背景哦。
* 一般只会在创建时调用一次。相当于为我们创建一个进行动画效果时的一个背景图。
* 此方法亦可以通过setView替代
*/
@Override
public View makeView() {
ImageView imageView = new ImageView(GalleryActivity.this);
// 设置截取模式
imageView.setScaleType(ScaleType.CENTER_INSIDE);
imageView.setBackgroundResource(R.drawable.ground);
Toast.makeText(getApplicationContext(), "执行了一次",
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()可以设置当图片大小和容器大小不匹配时的剪辑模式.
* ScaleType.CENTER_INSIDE的意思是，按图片的原比例缩小或者扩大，直到长或者宽中的任何一个顶到容器为止
*/
image.setScaleType(ScaleType.CENTER_INSIDE);
return image;
}
}
/**
* 当gallery的图像发生变化时，同步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>
升级版
较之上面的，效果还是一样的，只不过这里添加了这么以下几个功能：
第一：下方图片的自适应长宽（在保证长宽比例的情况下哦）
第二：触摸大图同样可以进行图片切换（没有机器，没法测试，但是基本的思路还是正确的）
代码：
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);
/**
* 设置窗口无标题栏,一定要在setContentView前进行设置哦
*/
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可以设置淡入动画
* setOutAnimation可以设置淡出动画
*/
imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(
getApplicationContext(), android.R.anim.fade_in));
imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(
getApplicationContext(), android.R.anim.fade_out));
imageSwitcher.setFactory(new ViewFactory() {
/**
* 创建一个新的图片放置到ImageSwitcher上,可以使用其设置背景哦。
* 一般只会在创建时调用一次。相当于为我们创建一个进行动画效果时的一个背景图。
* 此方法亦可以通过setView替代
*/
@Override
public View makeView() {
ImageView imageView = new ImageView(GalleryActivity.this);
// 设置截取模式
imageView.setScaleType(ScaleType.CENTER_INSIDE);
imageView.setBackgroundResource(R.drawable.ground);
Toast.makeText(getApplicationContext(), "执行了一次",
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;
}
/***
* 该方法的实现稍微复杂一些，主要思想就是，要对图片的大小进行自动剪裁，让其正好宽或者长顶到允许的最大值
* 这里主要用到了BitmapFactory Bitmap 用于图片获取和处理
* DecaimalFormat 用于对double数据进行格式规划（这里是只允许小数点后两位）
*/
@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+"");
// 缩小或者放大的倍数关系
double scale;
double widthScale = (maxImageWidth*100)/(bitMapWidth*100.0);//这里乘以100然后除以100.0的目的是为了让其返回double类型
double heightScale = (maxImageHeight*100)/(bitMapHeight*100.0);
// 规划获得的格式（小数点后两位）
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+"");
// 根据原图片生成一个缩放后的图片
Bitmap bitmap2 = Bitmap.createScaledBitmap(bitmap, (int)(bitMapWidth*scale), (int)(bitMapHeight*scale), true);
// 将图片绑定到ImageView
image.setImageBitmap(bitmap2);
/**
* setScaleType()可以设置当图片大小和容器大小不匹配时的剪辑模式.
* ScaleType.CENTER_INSIDE的意思是，按图片的原比例缩小或者扩大，直到长或者宽中的任何一个顶到容器为止
* 因为在上面我们已经重新生成了一个图片放在gallery上，大小已经符合要求了，所以这里就不需要再通过
* setScaleType进行剪裁了。有些人可能觉得笔者脑子有病，有简单的不用，非要用那么复杂的，这里呢，其实只是
* 给大家的一个使用范例，我们通过bitmap可不仅仅是缩放图片哦，还可以倾斜、移动等等……
*/
// image.setScaleType(ScaleType.CENTER_INSIDE);
image.setAdjustViewBounds(true);// 自适应边框处理
image.setLayoutParams(new Gallery.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
return image;
}
}
/**
* 当gallery的图像发生变化时，同步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 ;
/***
* 屏幕被触摸时提供的方法,这里我们通过它来实现拖动大图片，也会自动切换图片o
*/
@Override
public boolean onTouch(View v, MotionEvent event) {
Log.i("是否正在触摸", "yes");
int actionName = event.getAction();
float []position = null;
//被按下时
if(actionName==MotionEvent.ACTION_DOWN){
i = 0;
}
// 被按着拖动时
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编程实现的超炫图片浏览器
本文实例讲述了Android编程实现的超炫图片浏览器.分享给大家供大家参考,具体如下: 使用过Android自带的gallery组件的人都知道,gallery实现的效果就是拖动浏览一组图片,相比iphone里也是用于拖动浏览图片的coverflow,显然逊色不少.实际上,可以通过扩展gallery,通过伪3D变换可以基本实现coverflow的效果.本文通过源代码解析这一功能的实现.具体代码作用可参照注释. 最终实现效果如下: 要使用gallery,我们必须首先给其指定一个adapter.在这里
-
Android实现网页图片浏览功能
本文实例为大家分享了AndAndroid实现网页图片浏览的具体代码,供大家参考,具体内容如下 基本功能:输入图片的url然后点击按钮加载出来图片 activity_main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools=&
-
Android微信图片浏览框架设计
一.业务场景 1.聊天界面发送图片==>多选点选+有右上角"发送"+图片预览==>图片预览支持右上角"发送"逻辑 2.发表动态==>多选点选+右上角"完成" + 图片预览==>图片预览支持右上角"完成"逻辑 3.个人资料更改头像==>单选点选 + 图片预览截图==>图片预览截图支持右上角"使用"逻辑 二.Intent参数设计; (Intent传参原则:尽量不要使用自定义类
-
Android实现网络图片浏览器
本文实例为大家分享了Android网络图片浏览器的制作过程,供大家参考,具体内容如下 一.创建一个"网络图片浏览器的应用程序",并设计用户交互界面,"网络图片浏览器"对应的布局文件(activity_main.xml)代码如下: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.and
-
Android使用gallery和imageSwitch制作可左右循环滑动的图片浏览器
效果图: 为了使图片浏览器左右无限循环滑动 我们要自定义gallery的adapter 如果要想自定义adapter首先要了解这几个方法 @Override public int getCount() { // TODO Auto-generated method stub return 0; } @Override public Object getItem(int position) { // TODO Auto-generated method stub return null; } @O
-
Android实现网络图片浏览功能
我们在上网的过程中经常看到各种图片,那你知道它是如何实现的吗?接下来就让我们一块探讨一下. 网络图片的浏览可以分为俩部分,基本的页面布局与界面交互,让我们一步步的来编写. 基本布局很简单,只需要有一个输入图片链接的EditText,一个浏览按钮,一个ImageView就差不多了.下面是简单代码. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="ht
-
Android实现图片浏览器示例
本文所述为一个基础的Android图片浏览器代码,是仿写Google原版实现的,代码中实现了主要的实现过程和方法,具体的完善还需要自己添加,代码中有很多注释,可帮助新手们快速理解代码,使用了部分图像资源. 主要功能代码如下: package com.android.coding; import android.app.Activity; import android.content.Context; import android.os.Bundle; import android.view.Vi
-
Android应用中图片浏览时实现自动切换功能的方法详解
先给最终效果图: 当我们在最下边的gallery中切换图片时,上面的大图片会自动切换,切换时有动画效果哦,很简单的一个程序,有待完善更多的功能! 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.V
-
Android实现图片自动切换功能(实例代码详解)
在Android中图片的自动切换不仅可以实现自动切换,而且还可以使用手动切换.而且一般在切换的时候,在图片下方还带有其他内容的切换,用来标记是第几个图片的切换. 这种效果在我们日常生活中很常见,例如某宝购物,一些商城都可以使用到,用户体验度极好,今天小编就通过实例代码给大家分享android 图片自动切换功能的实现. 实现效果如下: 具体的示例代码如下: 布局代码: <?xml version="1.0" encoding="utf-8"?> <S
-
Yii2框架实现登录、退出及自动登录功能的方法详解
本文实例讲述了Yii2框架实现登录.退出及自动登录功能的方法.分享给大家供大家参考,具体如下: 自动登录的原理很简单.主要就是利用cookie来实现的 在第一次登录的时候,如果登录成功并且选中了下次自动登录,那么就会把用户的认证信息保存到cookie中,cookie的有效期为1年或者几个月. 在下次登录的时候先判断cookie中是否存储了用户的信息,如果有则用cookie中存储的用户信息来登录, 配置User组件 首先在配置文件的components中设置user组件 'user' => [ '
-
Android OnCreate()中获取控件高度与宽度两种方法详解
Android OnCreate()中获取控件高度与宽度 试过在OnCreate()中获取控件高度与宽度的童鞋都知道,getWidth()与getHeight()方法返回是0,具体原因 看一下Activity的生命周期 就会明白. 上代码: 方法一: int w = View.MeasureSpec.makeMeasureSpec(0,View.MeasureSpec.UNSPECIFIED); int h = View.MeasureSpec.makeMeasureSpec(0,View.Me
-
Android中用Bmob实现短信验证码功能的方法详解
这篇文章主要介绍发送验证码和校验验证码的功能,用到一个第三方平台Bmob,那Bmob是什么呢?Bmob可以开发一个云存储的移动应用软件,他提供了大量的标准的API接口,根据需要接入相关服务,开发者可以更加专注于应用的开发,让产品交付更快速,验证码功能就是其中一个. 一.跟其他第三方一样,我们开发之前要做一些准备工作. 1.首先,去官网注册一个帐号:http://www.bmob.cn/: 2.然后就可以创建应用了:具体怎么做Bmob说得很清楚了(官方操作介绍),如果你不想看,我简单说一下:点击右
-
Linux实现自动挂载autofs的方法详解
目录 实现自动挂载-autofs autofs工具简单使用 autofs配置详细说明 自动挂载资源有两种格式 优化 Linux 系统性能 安装 Tuned 选择调整配置文件 检查系统推荐的调整配置文件 实现自动挂载-autofs autofs 服务实现自动挂载外围设备,NFS共享目录等,并在空闲5分钟后后自动卸载 相关包和文件 : 软件包:autofs 服务文件:/usr/lib/systemd/system/autofs.service 配置文件:/etc/auto.master autofs
-
vue-vuex中使用commit提交mutation来修改state的方法详解
在vuex中,关于修改state的方式,需要commit提交mutation.官方文档中有这么一句话: 更改 Vuex 的 store 中的状态的唯一方法是提交 mutation. 为了搞清楚其原因,查阅了很多资料,发现其它人在做vuex的源码解析的时候,并没有将这点说的很明白. 所以只好自己去查看vuex的源码,并且自己做demo进行验证. 但是试验后,发现直接修改state时,store中的state能够改变,并且是响应式的,并没有报错.跟commit提交mutation的方式没啥区别. 后
-
关于Python 中的时间处理包datetime和arrow的方法详解
在获取贝壳分的时候用到了时间处理函数,想要获取上个月时间包括年.月.日等 # 方法一: today = datetime.date.today() # 1. 获取「今天」 first = today.replace(day=1) # 2. 获取当前月的第一天 last_month = first - datetime.timedelta(days=1) # 3. 减一天,得到上个月的最后一天 print(last_month.strftime("%Y%m")) # 4. 格式化成指定形
-
微信小程序中的列表切换功能实例代码详解
感觉这列表切换有点类似于轮播图,而且感觉这代码直接可以拿来用,稍微改一改样式什么的就OK了,列表切换也是用到的地方也很多 wxml中的代码如下: <!-- 标签页面标题 --> <view class="tab"> <view class="tab-item {{tab==0?'active':''}}" bindtap="changeItem" data-item="0">音乐推荐<
-
Javaweb中Request获取表单数据的四种方法详解
目录 表单代码 request.getParamter(String name);通过name获取值 request.getParamterValues(String name);通过name获取value值(一般用于复选框获取值) 代码片段 request.getParameterNames();直接获取表单所有对象的name值,返回值是枚举集合 request.getParameterMap();直接获取表单所有对象的name值以及数据 表单代码 <!DOCTYPE html> <h