Fresco通過後處理器(Postprocessor)生成仿skype字母和背景色的頭像

2015年末新版skype中,如果用戶沒有設置頭像,那麼skype就會給用戶生成一個頭像,生成規則如下:如果用戶名是george.yang,那麼他的頭像是G(文字大寫居中)加指定的背景色。
在我們的app中需要加這個功能,app使用圖片加載框架是facebook的Fresco,Fresco給用戶自定義加載的能力很差,建議以後不要使用它了~

步驟1:準備後處理器

public class UserHeadPostprocessor extends BasePostprocessor {
    private String userName;
    public UserHeadPostprocessor (String userName) {
        this.userName = userName;
    }

    @Override
    public String getName() {
        return "userHeadPostprocessor";
    }

    @Override
    public void process(Bitmap bitmap) {
        char chr = userName.toUpperCase().charAt(0);
        int bgColor = getColor(chr);

        //圖象大小要根據文字大小算下,以和文本長度對應
        Canvas canvasTemp = new Canvas(bitmap);
        canvasTemp.drawColor(bgColor);
    }

參考:http://fresco-cn.org/docs/modifying-image.html

步驟2:獲取大寫字母對應的背景色

要讓每個字母對應一個顏色,總不能真的準備26張圖吧?不對是27張,如果用戶名已字母開頭或其他國家的文字開頭,那麼不屬於a-z的統一爲一種顏色,總共26+1,27種顏色,所以我們要生成27種顏色,顏色由RGB三個基本顏色構成,在android中表示是#ARGB,每個字母是0-254的16進製表示的,如果是不透明全白色,則表示成#FFFFFFFF,那麼不算透明度,有3種數值可以構成顏色,有趣的是3^3=27,如果每種顏色分成3段,那麼長度爲3的3進制剛好可以把顏色拼起來,代碼如下:

 private int getColor(char chr) {
        String coloIndexs;
        if (chr>='A' && chr <='Z') {
            coloIndexs = Integer.toString(chr-'A',3);
        } else {
            coloIndexs= Integer.toString(27,3);
        }
        if (coloIndexs.length()==1) {
            coloIndexs = "00"+coloIndexs;
        } else if (coloIndexs.length()==2) {
            coloIndexs = "0"+coloIndexs;
        }
        StringBuilder sb = new StringBuilder("#FF");
        for (char ch:coloIndexs.toCharArray()) {
            int colorCut = 0;
            //255/3=85 (0-85,86-170,170-255)
            if (ch=='1') {
                colorCut = 70;
            } else if (ch == '2') {
                colorCut = 150;
            } else {
                colorCut = 230;
            }
            String colorCut16 = Integer.toHexString(colorCut).toUpperCase();
            sb.append(colorCut16);
        }
        int bgColor = Color.parseColor(sb.toString());
        return bgColor;
    }

博客出處
參考:
http://cavonchen.iteye.com/blog/626318
http://blog.csdn.net/is_zhoufeng/article/details/8544246
http://blog.csdn.net/you23hai45/article/details/18330325

步驟3:畫文字,居中

    public void process2(Bitmap bitmap) {
        char chr = userName.toUpperCase().charAt(0);
        int bgColor = getColor(chr);

        //圖象大小要根據文字大小算下,以和文本長度對應
        Canvas canvasTemp = new Canvas(bitmap);
        canvasTemp.drawColor(bgColor);
        Paint p = new Paint();
        p.setColor(Color.BLACK);
        Typeface font = Typeface.create("宋體", Typeface.BOLD);
        p.setTypeface(font);
        p.setAntiAlias(true);//去除鋸齒
        p.setFilterBitmap(true);//對位圖進行濾波處理
        p.setTextSize(bitmap.getWidth());

        Rect rect = new Rect();
        p.getTextBounds(String.valueOf(chr), 0, 1, rect);

         canvasTemp.drawText(String.valueOf(chr),bitmap.getWidth()/2f-rect.width()/2f,bitmap.getHeight()/2f-rect.height()/2f,p);
    }

參考:
http://blog.csdn.net/leolaurel/article/details/7719759

步驟4:設置預處理器

Uri uri = new Uri.Builder()).scheme("res").path(String.valueOf(R.drawable.home_page_upload_icon)).build()
//把資源文件轉成uri,給它加載,不然不會交給後處理器處理啊~
    ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri)
                    .setPostprocessor(new UserHeadPostprocessor(userName))
                    .build();

            PipelineDraweeController controller = (PipelineDraweeController)
                    Fresco.newDraweeControllerBuilder()
                            .setImageRequest(request)
                            .setOldController(userHead.getController())
                            .build();

            userHead.setController(controller);

參考:http://www.bubuko.com/infodetail-1003701.html

發佈了86 篇原創文章 · 獲贊 4 · 訪問量 25萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章