本文目录
android怎么使用svg代码
编写 vector drawable 资源文件《?xml version="1.0" encoding="utf-8"?》***隐藏网址*** android:width="600dp" android:height="600dp" android:viewportHeight="512" android:viewportWidth="512"》 《path android:fillColor="#410a0a0a" android:pathData="@string/pretty_girl"/》《/vector》12345678910111234567891011这里解释一下这几个属性； android:width=”600dp” 实际显示的宽度为600dp android:height=”600dp” 实际显示的高度为600dp android:viewportHeight=”512” 矢量限定的宽度为512，这没有单位； android:viewportWidth=”512” 矢量限定的高度为512 其实以上两个属性，就是我们 svg 图片的宽高 运用，与其他 drawable 资源文件一样，直接设置 View 的背景或者 ImageView 的 src 资源***隐藏网址*** android:layout_width="match_parent" android:layout_height="match_parent"》 《ImageView android:id="@+id/id_img" android:layout_centerInParent="true" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/pretty_girl"/》《/RelativeLayout
webview怎么做适配html
webview适配html的方法是通过meta 标签指定屏幕的分辨率。比如常用写法如下：《meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"》特殊说明：这里表示 viewport 的宽度为匹配设备屏幕的宽度，且禁用缩放。涉及到两个概念：viewport 元素devicePixelRatio：设备上物理像素和设备独立像素(device-independent pixels (dips))的比例。由于 iphone 手机和 android 4.0 以上的手机支持修改 viewport 的 width 来改变页面的缩放情况，因此我们可以将 width 指定为页面设计的宽度，如此一来，你的页面正好充满 viewport 并全屏显示，而不会缩放。例如：《meta name="viewport" content="width=640px, user-scalable=no"》但是对于 android 4.0 以下的手机，不支持设置 viewport 的 width，但是我们可以设置 Android 的另一参数target-densitydpi，从而达到相同的目的，计算 target-densitydpi 的公式如下：target-densitydpi = UI-width / device-width * window.devicePixelRatio * 160; //UI-width ：WebApp布局宽度 //device-width ：屏幕分辨率宽度最终的解决方法：《meta name="viewport" content="target-densitydpi=device-dpi, width=640px, user-scalable=no"》$(function () { var DEFAULT_WIDTH = 640, // 页面的默认宽度 ua = navigator.userAgent.toLowerCase(), // 根据 user agent 的信息获取浏览器信息 deviceWidth = window.screen.width, // 设备的宽度 devicePixelRatio = window.devicePixelRatio || 1, // 物理像素和设备独立像素的比例，默认为1 targetDensitydpi; // Android4.0以下手机不支持viewport的width，需要设置target-densitydpi if (ua.indexOf("android") !== -1 && parseFloat(ua.slice(ua.indexOf("android")+8)) 《 4) { targetDensitydpi = DEFAULT_WIDTH / deviceWidth * devicePixelRatio * 160; $(’meta’).attr(’content’, ’target-densitydpi=’ + targetDensitydpi + ’, width=device-width, user-scalable=no’); } // TODO: 其他手机需要特殊处理的在下面});
为什么viewport的width=device-width，加上去没效果
我查了下viewport，有几个属性：width - viewport的宽度 height - viewport的高度initial-scale - 初始的缩放比例minimum-scale - 允许用户缩放到的最小比例maximum-scale - 允许用户缩放到的最大比例user-scalable - 用户是否可以手动缩放估计是本身页面尺寸就是那么大吧【本人还没开始接触手机WEB前端，请恕我见识短浅
使用viewport页面显示内容过大
《meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"》viewport做不到真的让你的页面自适应。手机浏览器是把页面放在一个虚拟的“窗口”（viewport）中，通常这个虚拟的“窗口”（viewport）比屏幕宽，这样就不用把每个网页挤到很小的窗口中（这样会破坏没有针对手机浏览器优化的网页的布局），用户可以通过平移和缩放来看网页的不同部分。移动版的 Safari 浏览器最新引进了 viewport 这个 meta tag，让网页开发者来控制 viewport 的大小和缩放，其他手机浏览器也基本支持。所以解决方式：去了解了解“响应式布局”(响应式的布局的前提就是设置《meta name="viewport")，不同的手机、平板的尺寸不一样。所以能很好掌握响应式布局就能做好手机上的自适应。
