Android使用富文字實現點贊效果(包含點贊人員的頭像)
這篇文章介紹一下使用富文字實現點贊展示效果(包含點贊人員的頭像),之前使用的是SpannableString寫的,但是隻是實現了顯示預設的小心心和後邊的暱稱,頭像沒有展示展示出來。後來將SpannableString換成了SpannableStringBuilder。整體思路就是:使用多個SpannableStringBuilder將預設的小心心、個人頭像、暱稱拼接起來顯示。下面是程式碼所示:
//設定點贊具體人員(利用富文字)
//判斷點讚的集合是否為空
if (ListHelper.isNotEmpty(item.getLikes())) {
//tv_community_like是展示點贊資訊的TextView
tv_community_like.setVisibility(View.VISIBLE);
SpannableStringBuilder[] builder = new SpannableStringBuilder[1]; SpannableStringBuilder defaultStringBuilder = new SpannableStringBuilder("#"); //blue_heart為預設的小心心圖片,可以將小心心圖片換成自己需要的 Drawable drawable = context.getResources().getDrawable(R.mipmap.blue_heart); drawable.setBounds(0, 5, 40, 40);//這是將小心心圖片繪製在某一矩形區域內 //HouseImageSpan是自定義的ImageSpan為了實現將點贊資訊垂直居中顯示而寫,後面會詳細介紹 HouseImageSpan imageSpan = new HouseImageSpan(drawable); defaultStringBuilder.setSpan(imageSpan, 0, 1, Spanned.SPAN_INCLUSIVE_EXCLUSIVE); builder[0] = defaultStringBuilder; for (int i = 0; i < item.getLikes().size(); i++) { //moren_head_2是頭像未加載出來之前顯示的預設圖片,可以根據需求自己更換 Drawable drawable1 = context.getResources().getDrawable(R.mipmap.moren_head_2); drawable1.setBounds(0, 15, 80, 15); HouseImageSpan imageSpan1 = new HouseImageSpan(drawable1); //imgStringBuilder 為預設頭像顯示的SpannableStringBuilder,最後需要將其與其他SpannableStringBuilder拼接在一起展示 final SpannableStringBuilder[] imgStringBuilder = {new SpannableStringBuilder("#")}; imgStringBuilder[0].setSpan(imageSpan1, 0, 1, Spanned.SPAN_INCLUSIVE_EXCLUSIVE); if (StringHelper.isNotEmpty(item.getLikes().get(i).getLogo())) { int finalI = i; //使用Glide將網路圖片的URL(item.getLikes().get(i).getLogo())轉成Bitmap Glide.with(MyApplication.getApplication().getApplicationContext()) .load(item.getLikes().get(i).getLogo()).asBitmap().into(new SimpleTarget<Bitmap>() { @Override public void onResourceReady(Bitmap resource, GlideAnimation<? super Bitmap> glideAnimation) { //將轉成的Bitmap(resource)轉成縮圖 Bitmap bitmap = BitmapHelper.getImageSmall(resource, 120, 120); //將Bitmap轉成圓形圖片 Bitmap bitmap2 = BitmapHelper.toRoundBitmap(bitmap); HouseImageSpan imageSpan2 = new HouseImageSpan(bitmap2); imgStringBuilder[0].setSpan(imageSpan2, 0, 1, Spanned.SPAN_INCLUSIVE_EXCLUSIVE); builder[0] = builder[0].append(imgStringBuilder[0]); } }); } //nickNameBuilder為暱稱的SpannableStringBuilder SpannableStringBuilder nickNameBuilder; if (i == item.getLikes().size() - 1) { nickNameBuilder = new SpannableStringBuilder(item.getLikes().get(i).getNickname()); } else { nickNameBuilder = new SpannableStringBuilder(item.getLikes().get(i).getNickname() + ","); } builder[0] = builder[0].append(nickNameBuilder); } //builder[0]就是最終要展示的SpannableStringBuilder tv_community_like.setText(builder[0]); } else { tv_community_like.setVisibility(View.GONE); }
以上就是所有展示此效果的程式碼,下面介紹文章中提到的自定義ImageSpan
public class HouseImageSpan extends ImageSpan {
public HouseImageSpan(Drawable d) {
super(d);
}
public HouseImageSpan(Bitmap b){ super(b); } //通過改變getSize方法來改變位置垂直居中顯示 public int getSize(Paint paint,CharSequence text,int start,int end,Paint.FontMetricsInt fm){ Drawable d = getDrawable(); Rect rect = d.getBounds(); if (fm != null) { Paint.FontMetricsInt fmPaint=paint.getFontMetricsInt(); int fontHeight = fmPaint.bottom - fmPaint.top; int drHeight=rect.bottom-rect.top; int top= drHeight/2 - fontHeight/4; int bottom=drHeight/2 + fontHeight/4; fm.ascent=-bottom; fm.top=-bottom; fm.bottom=top; fm.descent=top; } return rect.right; } @Override public void draw(Canvas canvas, CharSequence text, int start, int end, float x, int top, int y, int bottom, Paint paint) { Drawable b = getDrawable(); canvas.save(); int transY = 0; transY = ((bottom-top) - b.getBounds().bottom)/2+top; canvas.translate(x, transY); b.draw(canvas); canvas.restore(); }
}
文章中提到的將原圖轉成縮圖的方法是
public static Bitmap getImageSmall(Bitmap bm, int newWidth, int newHeight) {
int width = bm.getWidth();
int height = bm.getHeight();
// 設定想要的大小
// 計算縮放比例
float scaleWidth = ((float) newWidth) / width;
float scaleHeight = ((float) newHeight) / height;
// 取得想要縮放的matrix引數
Matrix matrix = new Matrix();
matrix.postScale(scaleWidth, scaleHeight);
// 得到新的圖片
Bitmap newbm = Bitmap.createBitmap(bm, 0, 0, width, height, matrix, true);
return newbm;
}
通過以上方法可以將原圖轉成縮圖,下面再介紹將縮圖轉成圓形圖片
/**
* bitmap圓形處理
*
* @param bitmap
* @return
*/
public static Bitmap toRoundBitmap(Bitmap bitmap) {
int width = bitmap.getWidth();
int height = bitmap.getHeight();
float roundPx;
float left, top, right, bottom, dst_left, dst_top, dst_right, dst_bottom;
if (width <= height) {
roundPx = width / 2;
top = 0;
bottom = width;
left = 0;
right = width;
height = width;
dst_left = 0;
dst_top = 0;
dst_right = width;
dst_bottom = width;
} else {
roundPx = height / 2;
float clip = (width - height) / 2;
left = clip;
right = width - clip;
top = 0;
bottom = height;
width = height;
dst_left = 0;
dst_top = 0;
dst_right = height;
dst_bottom = height;
}
Bitmap output = Bitmap.createBitmap(width,
height, Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(output);
final int color = 0xff424242;
final Paint paint = new Paint();
final Rect src = new Rect((int) left, (int) top, (int) right, (int) bottom);
final Rect dst = new Rect((int) dst_left, (int) dst_top, (int) dst_right, (int) dst_bottom);
final RectF rectF = new RectF(dst);
paint.setAntiAlias(true);
canvas.drawARGB(0, 0, 0, 0);
paint.setColor(color);
canvas.drawRoundRect(rectF, roundPx, roundPx, paint);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
canvas.drawBitmap(bitmap, src, dst, paint);
return output;
}
下面展示一下效果
以上就是所有功能的實現,感謝大家
相關推薦
Android使用富文字實現點贊效果(包含點贊人員的頭像)
這篇文章介紹一下使用富文字實現點贊展示效果(包含點贊人員的頭像),之前使用的是SpannableString寫的,但是隻是實現了顯示預設的小心心和後邊的暱稱,頭像沒有展示展示出來。後來將SpannableString換成了SpannableStringBuild
Android富文字實現不同的文字新增點選事件
如果可以點選的文字位置是固定不變的,可以在String.xml中配置(如:“可以點選的”給“點選”設定點選事件)。 @Override protected void onCreate(Bundle s
Android中對文字實現跑馬燈效果
關於在Android中文字實現跑馬燈效果 方法一:(只能實現單個TextView的跑馬燈效果) android:singleLine=”true”只能單行,超出的文字顯示為”…” android:
Android使用GestureDetector實現手勢滑動效果
void tco event else if rate method sta pro 手勢滑動 直接看實例: package com.example.gesturedetector; import android.os.Bundle; import
Android開發之實現水平滾動效果—RecyclerView
ListView由於其強大的功能,在過去的Android開發中有著卓越的貢獻,然而使用ListView,如果不使用一些技巧來提升其效率的話,那麼ListView的效能會很差。 為此,Android提供了一個更加強大的滾動控制元件–RecyclerView。下面
Android中AlertDialog實現圓角邊框效果
背景 微博的圓角邊框的Dialog使用者體驗很好,讓我們一起來實現這個功能,然後應用到自己的專案中去。 微博中圖示為: 實現思路 新建一個AlertDialog物件並顯示,然後獲取這個dialog的Window物件,給這個Window物件設定自定義vi
Android使用GPUImage實現濾鏡效果精煉詳解(一)
一、前期基礎知識詳解 “濾鏡通常用於相機鏡頭作為調色、新增效果之用。如UV鏡、偏振鏡、星光鏡、各種色彩濾光片。濾鏡也是繪圖軟體中用於製造特殊效果的工具統稱,以Photoshop為例,它擁有風格化、畫筆描邊、模糊、扭曲、銳化、視訊、素描、紋理、畫素化、渲染、藝術效果、其他
android使用ViewPager實現引導頁效果
對於大多數android開發者來說,ViewPager和ListView是再熟悉不過了,ViewPager的實現思路和ListView大同小異,具體參照前面的ListView詳解。在實現基礎的ViewPager後還加上了一個類似於Tab的效果。 下面來一一詳解
android富文字 載入帶圖片的html
textView載入帶圖片的html 在android中textView中setText中加入富文字以及webView嵌入url是android互動html最簡單的兩種方式; 最近在專案中涉及到富文字; 當不考慮html中
Android 使用TextView實現跑馬燈效果
too pan 例如 use teset ble isf deb png 前言 我們在開發中經常會遇到一個小問題。比如下面一個小例子: 這個文字太長,單行中導致無法全部顯示出來,這就是今天要實現的功能。 當然,百度中也有很多這種解決方案。 其中有一種,例如:
android 富文字SpannableString去掉下劃線
總有些細節設計總監總是揪著不放,做的app中有個textview牽扯到了url連結,但是老大的意思是不能存在下劃線,如下圖: -----》 程式碼如下: String msg =
富文字字串顏色改變效果
本文的目的在於將每天開發中用到的小技巧記錄下來,方便自己和大家檢視。 我這裡主要講解的是通過程式碼動態的改變搜尋時的文字顯示狀態,主要步驟: 1.獲取源字串 :originalString 2.實現下面的方法 //改變匹配字串的字型顏色 - (NSMutableAttr
android xml bitmap 實現波浪線效果
我們要實現的效果如下: 找了一些關於實現波浪線的方法,總感覺不大滿意,常見的方法有 1、直接搞一個這樣的波浪線的切圖 這種方式最簡單,但是劣勢也非常明顯,如果view的寬度過大,則會出現
Android利用RecyclerView實現列表倒計時效果
只需要 過程 net looper 更新列表 code setimage update over 最近面試時,面試官問了一個列表倒計時效果如何實現,然後腦袋突然懵的了O(∩_∩)O,現在記錄一下。 運行效果圖 實現思路 實現方法主要有兩個: 1.為每個開始倒計時的it
Android 7.0實現拍照、獲取相簿圖片上傳頭像功能
對網上關於Android7.0的上傳頭像進行整理 1.新增許可權管理。內容例如以下: <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/> <uses-pe
設定TextView等View元件點選效果。點選修改背景。字型顏色等
Android TextView等 預設是不帶點選效果的。。有的時候為了給使用者一個提示。可能需要我們自己新增點選效果。很多APP都是這樣實現的。 下面上一張圖看看效果。 下面是程式碼。 <TextView android:id="@+id/tv" android
按鈕點選效果(點選變顏色不點恢復顏色)
在點選的過程中按鈕變顏色,可以方便看到是否觸發了按鈕的點選事件function changeColor(id,class1,class2) { $("#instbtn").on("touchstart",function () {
TextView+SpannableString實現Android中富文字的顯示及點選衝突解決
前言 最近專案中需要實現一個文章跟讀效果的顯示,還要能夠點選文章中的單詞能夠彈出對話方塊顯示單詞的英美髮音,那麼如何實現這樣的需求呢?當然是利用SpannableString啦,下面就結合專案中使用到的和參考其他部落格的成果,整理一下常用的用法吧。 SpannableString其
Android點贊效果的實現
先看下點讚的效果圖 首先新增依賴 api 'com.sackcentury:shinebutton:0.2.0' xml佈局 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=
Android自定義View教你一步一步實現即刻點贊效果
前言 今天朋友看了HenCoder的自定義View後說,HenCoder對自定義View講的不錯。實踐中仿寫即刻的點贊你有思路嗎,你不實現一下?二話不說,看了朋友手機效果,對他說:實現不難,用到了位移,縮放,漸變動畫和自定義View的基礎用法,好,那我實現一下,剛好加深對自定義View的理解。 素材準備