meta viewportを出し分けてディズプレー幅480のAndroidデバイスに幅640pxのコンテンツを縮小してきちんと納まるよう表示させたい
とあるUnity案件でこういう対応をWebview側でなんとかする必要があったので対応。
phpからwindow.devicePixcelRatioを取得できればいいのだが現状JSからしかcook取得できないので、JSでcookieに格納後、PHPからクッキーを読みに行くという方法を採った。
$is_low_resolution = NULL; if(isset($_COOKIE["device_pixel_ratio"])) { $is_low_resolution = ($_COOKIE["device_pixel_ratio"] == 1.5); } $smarty = new Smarty; $smarty->assign("is_low_resolution", $is_low_resolution);
{if $is_low_resolution} <meta name="viewport" content = "width=480, minimum-scale=0.75, maximum-scale=0.75,initial-scale= 0.75"> {else} <meta name="viewport" content = "width=640, user-scalable= 0"> {/if}
document.addEventListener("DOMContentLoaded",function(){ newAdjDeviceWidth (); }, false); function newAdjDeviceWidth () { var allcookies = document.cookie; var devicePixelRatio = allcookies.indexOf("device_pixel_ratio="); if(devicePixelRatio == -1) { document.cookie = 'device_pixel_ratio=' + window.devicePixelRatio; window.location.reload(); } }