1. 程式人生 > >Android螢幕適配實戰

Android螢幕適配實戰

說一下在專案裡面遇到的一個問題,和解決思路。
需求來源於運營小姐姐,她們希望在App的搜尋關鍵字前面加上圖片醒目效果圖如下

這裡寫圖片描述

佈局很簡單左邊一個SimpleDraweeView,右邊一個TextView,圖片來自於服務端。小姐姐們希望活動標高度寫死,寬度服務端返多少大小的圖片就顯示多少大小。然後到了一年一度撕逼的時候,撕逼原因來自與SimpleDraweeView只支援寬度高度都寫死。撕逼結果當然是弱勢方(可憐的Android開發同學)從了,為什麼?因為他們力氣大嘛。- -。

當然,解決方案還是有的,就是多寫了一些程式碼,就是在SimpleDraweeView的網路回撥上測量到圖片的實際寬度,高度,動態設定SimpleDraweeView的屬性就可以了,具體實現檢視

這篇文章 要翻牆才可以看哦。然後就提交程式碼,幹別的事情去了。

過了半天,測試大叔就報BUG過來了,具體看下圖。
這裡寫圖片描述
小夥子啊,看一看這個圖片顯示不全啊,怎麼肥四???
當時服務端沒給小圖,就沒看結果嘛。寶寶心裡也很委屈。
好吧,那就解決問題吧。到底問題在哪裡呢。於是開始打斷點一通托馬斯迴旋操作,發現問題在於我通過SimpleDraweeView的回撥拿到的寬高是圖片的真是畫素值,以這個活動表為例子,真實畫素為高32px,寬48px。然而不能直接把這個畫素設定給手機,因為手機的螢幕畫素不一,產生的dp值是有意義的呢。這裡不深入探究dp,就以解決這個問題。那怎麼辦呢?
問題的核心其實歸結一句話就是在一隻Android手機上dp和px的比值是一定的。
再回到我們的問題,分析一下。
這是xml程式碼

<com.facebook.drawee.view.SimpleDraweeView
        app:placeholderImage="@drawable/default_cover"
        android:layout_gravity="center_vertical"
        android:layout_marginLeft="@dimen/dp_10"
        android:id="@+id/sdv_tag"
        android:layout_width="wrap_content"
        android:layout_height="@dimen/dp_16"
/>

我在這裡把高度寫死了16dp,但是我調試出來圖片的實際設定到手機上的畫素是42px,然而圖片的實際大小高度是32px,所以可以推斷出Android手機在顯示圖片前會自動得對圖片進行放縮,那我們如果要還原為原來的圖片只要計算出每臺Android的放縮比例就可以了。所以我寫了這行程式碼

 int px = imageInfo.getWidth() * DisplayUtil.dp2px(context, 16) / 32;
            simpleDraweeView.getLayoutParams().width = px;
            simpleDraweeView.requestLayout();

這裡寫圖片描述
我們來分析一下第一行程式碼
這裡有幾個已知量,我得到的圖片的實際寬度w,我在xml裡面設定的高度dp值d,以及得到的實際高度h, 以及我在手機上實際設定的高度hx
hx = f(d); // 算出設定高度
所以縮放比例 = hx / h //這是縮放的比例
所以實際設定寬度 = w * 縮放比例;

ok,這樣就解決這個問題了。所以總結一下。運營是開發最好的老師,致敬所有的運營爸爸們。