在我们平常开发的过程中在做引导页适配的时候,有时候会犯难,怎么样作图可以将各种不同尺寸分辨率的手机都适配好也就是不变形不拉伸,官方给的说法也只是做多套图去适配不同的分辨率,遇到全屏展示引导这种问题的时候就有些力不从心了。接下来我们就展示一下如何使用一张图来适配市面上的绝大部分手机:

这个办法是反编译微信得出的想法,微信的包里面只有一张1920*1080的图,我们观察了微信在不同尺寸手机上的展示效果,它肯定是没有变形的,根据这个思路,我们发现它在适配不同的手机对图片做了缩放裁剪等处理。

接下来我们就实现一下如何对图片进行适当的缩放及裁剪:

大伙也都看到了,我们选择了两台具有代表性的设备:一台分辨率是800*480,一台是1152*1920.这两台设备的高宽比是不一样的。

为了适配这两台代表性的设备,首先我们需要对图片进行等比缩放:

我们需要先行计算将要放大的图片的高度:

将要放大的图片的高度=原图的宽度*屏幕的高度/屏幕的宽度;

上面这个计算公式不用我说为什么吧,小学就学过的。至于原图放大会模糊的问题,一般屏幕的宽度最大也就是1080,只是魅族有些奇葩会是1152,如果担心这个问题的话,请美工给图的时候,直接按照1152的宽来就好了。

其次,我们为了良好的展示在节目上,面对于不同尺寸屏幕的手机,它们的高宽比是不一样的,所以我们的基本思想就是以宽度为基准,放大图片,然后以中心为准裁剪多余的部分(对于图片高度不足裁剪的手机,可能才疏学浅,还没见过)。

贴代码:

package com.sahadev.guide;import android.app.Activity;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Point;
import android.graphics.drawable.BitmapDrawable;
import android.os.Bundle;
import android.view.View;
import android.view.ViewTreeObserver.OnGlobalLayoutListener;
import android.view.Window;public class MainActivity extends Activity {@Overrideprotected void onCreate(Bundle savedInstanceState) {requestWindowFeature(Window.FEATURE_NO_TITLE);super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);scaleImage(this, findViewById(R.id.rootView), R.drawable.guide);}public static void scaleImage(final Activity activity, final View view, int drawableResId) {// 获取屏幕的高宽Point outSize = new Point();activity.getWindow().getWindowManager().getDefaultDisplay().getSize(outSize);// 解析将要被处理的图片Bitmap resourceBitmap = BitmapFactory.decodeResource(activity.getResources(), drawableResId);if (resourceBitmap == null) {return;}// 开始对图片进行拉伸或者缩放// 使用图片的缩放比例计算将要放大的图片的高度int bitmapScaledHeight = Math.round(resourceBitmap.getHeight() * outSize.x * 1.0f / resourceBitmap.getWidth());// 以屏幕的宽度为基准,如果图片的宽度比屏幕宽,则等比缩小,如果窄,则放大final Bitmap scaledBitmap = Bitmap.createScaledBitmap(resourceBitmap, outSize.x, bitmapScaledHeight, false);view.getViewTreeObserver().addOnPreDrawListener(new ViewTreeObserver.OnPreDrawListener() {@Overridepublic boolean onPreDraw() {//这里防止图像的重复创建,避免申请不必要的内存空间if (scaledBitmap.isRecycled())//必须返回truereturn true;// 当UI绘制完毕,我们对图片进行处理int viewHeight = view.getMeasuredHeight();// 计算将要裁剪的图片的顶部以及底部的偏移量int offset = (scaledBitmap.getHeight() - viewHeight) / 2;// 对图片以中心进行裁剪,裁剪出的图片就是非常适合做引导页的图片了Bitmap finallyBitmap = Bitmap.createBitmap(scaledBitmap, 0, offset, scaledBitmap.getWidth(),scaledBitmap.getHeight() - offset * 2);if (!finallyBitmap.equals(scaledBitmap)) {//如果返回的不是原图,则对原图进行回收scaledBitmap.recycle();System.gc();}// 设置图片显示view.setBackgroundDrawable(new BitmapDrawable(context.getResources(), finallyBitmap));return true;}});}
}

最后看实际运行效果:

1. 2. 3.

4. 5.

1.MX4 1152*1920

2.SAMSUNG G7106 720*1280

3.HTC D316d 540*960

4.NUBIA X6 1920*1080

5.HUAWEI Y330-C00 480*800

怎么样,效果还不错吧,不过肉眼几乎看不出来它们是否变形,如果有疑问,可以使用PS对他们进行等比缩放,然后叠加测试效果。比例相同的分辨率显示效果是一致的,如果比例不同会有一部分偏差,所以在美工设计图片的时候,请不要在最顶部以及最底部设置特殊标志,以免被裁剪。

最后注意scaleImage()方法请不要被外部多次调用,否则该方法内会生成多个Bitmap对象,容易造成内存溢出。

PS:scaleImage()方法内部针对于绘制测量的多次调用做了处理,避免了重复绘制与重复测量造成的多次Bitmap对象创建,可以放心使用。

android中如何使用一张图片适配不同尺寸的APP引导页相关推荐

  1. android 图片大小判断,android中如何使用一张图片适配不同尺寸的APP引导页

    在我们平常开发的过程中在做引导页适配的时候,有时候会犯难,怎么样作图可以将各种不同尺寸分辨率的手机都适配好也就是不变形不拉伸,官方给的说法也只是做多套图去适配不同的分辨率,遇到全屏展示引导这种问题的时 ...

  2. Android APP 引导页实现-第一次应用进入时加载

    APP引导页是每个优质APP必备的元素,下面我们研究一下如何只在第一次进入应用时进行加载引导页的方法. 1.判断是否第一次进入应用的方法: package com.yayun.guide;import ...

  3. Android之app引导页(背景图片切换加各个页面动画效果)

    转载:http://blog.csdn.net/lowprofile_coding/article/details/48037095 先看效果图: 1.显示三个页面的Activity  用view p ...

  4. 设计影视资源网+商城的android app——引导页(第一次进入,第二次已删除)

    app展示(非UI出身,请原谅则个): 项目整个进程: 目录 项目整个进程: 一.引导页设计 1.图片加载方式 2.第一次有引导页第二次没有 二.Tab按键设计 1.RadioButton组合成Tab ...

  5. 如何在android中水平放置三张图片,Android ACTION_VIEW多张图片

    我想要显示一到三张照片.我要等到运行时才能确切知道从Internet下载了多少张照片. 我不知道如何创建一个意图来显示照片.现在,我将它们缓存在我通过执行以下操作(无错误检查)而创建的文件夹下的sdc ...

  6. android8.0电脑壁纸,Android用原生分享多张图片适配7.0、8.0

    常规操作只能适配6.0及以下 直接上分享的代码: Intent share_intent = new Intent(); ArrayList imageUris = new ArrayList(); ...

  7. android引导页图片全屏适配,关于图片适配不同尺寸的image View(实战)

    分享人:广州华软佐罗 一. 前言 在前端开发过程中,设计稿中往往只提供一张图片,但是app内需要用到的尺寸各种各样. 同时图片不仅是信息的直接表达,也会为网站起到美观点缀的作用,图片的变形.过分裁切会 ...

  8. Android 欢迎引导页的魅力

    前言 纵观android市面上的所有APP,没有一个页面不具备欢迎引导页,可以看出引导页面的魅力有多大,引导页面能迅速抓住用户的眼球,让用户很快的了解该app的主打方向.一个好的引导页让人看了就喜欢, ...

  9. Android开发——解析App启动页(Splash)黑/白闪屏现象

    前言 我在开发App的时候,出现App在启动会出现短暂的黑/白闪屏现象.这样现象对用户的体验感是会产生不好的影响,于是我就研究这个现象的起因和解决办法.不负有心人,我在翻了很多博客,踩完坑之后找到起因 ...

最新文章

  1. 【建模必备】遗传算法的基本原理与步骤(适应度函数与适应度分配)
  2. git 恢复被覆盖本地提交内容
  3. python3 爬虫 requests安装_爬虫开发环境部署
  4. 深度学习笔记(22) Padding
  5. 类别动态绑定到TreeView控件
  6. li ul vue 滚动显示_vue ul循环滚动的问题
  7. 使用k-近邻算法进行分类
  8. html基础:基本标签
  9. Python简单数据清洗
  10. c语言结构体编程时钟,c语言简单数学时钟(结构体,指针),求大佬帮助
  11. 土地资源管理就业怎么这么难_我所理解的土地资源管理专业
  12. 7部必看的纪录片,每一部都堪称经典,让人叹为观止!
  13. 华硕ASUS手机平板官方刷机包raw格式解压修改工具
  14. Vue无缝滚动轮播插件vue-seamless-scroll
  15. 软件工程作业--网上书店
  16. 各种音视频编解码学习详解 h264 ,mpeg4 ,aac 等所有音视频格式
  17. 封装Vue组件的原则及技巧
  18. 如何选择好的软件测试技术?
  19. 413:Calling Extraterrestrial Intelligence Again(翻译 )
  20. LInux目录与路径

热门文章

  1. 关闭windows 7 home basic版 internet 连接状态测试
  2. ubuntu16.04+GTX1060+ CUDA9.0+CUDANN7.0 tensorflow(GPU)安装,实测有效,安装包我放在云盘中,直接下载使用。
  3. HTTPS劫匪木马暴力升级:破坏ARK攻击杀软
  4. java打印10行杨辉三角形_java实现打印杨辉三角形(帕斯卡三角形),打印10行
  5. 程序员找工作的各种坑…… 及防坑指南
  6. 博客园离线写博客工具
  7. linux静态插桩工具PEBIL
  8. 剩下最后一件商品,被同时购买怎么办
  9. 你做自媒体视频剪辑挣到钱了吗?
  10. 优秀项目管理者的必修课程5(项目收尾)-吴永达原创