Android QQ空間說說回復功能簡介

好久沒有寫博客了，主要最近項目太忙，而且都是一些沒有技術含量的東西，所以寫的就比較少。

最近項目里面有很多關于textview的樣式問題，比如一些字體設置了背景色，加粗，下劃線，中劃線等。

下面以QQ空間中說說的回復進行實例講解。

由于mac上軟件比較難用，沒有到qq的apk里面去扣一些表情過來，暫時拿默認的圖片作為一個表情。

上面圖片的中實例表示，“今天去星巴克喝咖啡了”表示一條說說，下面有三條留言是對主人“流水不腐”評論，同時評論最后還加了一個表情。

下面簡單說下技術要點：
1、一般情況下，思路是這樣的，一條評論是一行，可以是線性布局搞定，同時對用戶名稱和樓主的名稱添加藍色，如果有表情，那么則添加Imageview表示，這個在這里不做實現和分析，原因是因為，假如評論的條數太大，則效率是一個很大的問題。
2、、還有一些情況就是一條評論，單獨作為一個textview，使用Android 提供的SpannableString進行實現。

下面就上面的分析的思路，對方法二進行代碼實現，代碼如下

public class FirstFragment extends Fragment {


@InjectView(R.id.textview)
TextView textview;

String host = "流水不腐";
String[] names = {"張三", "李四", "二狗子"};
String comment = "土豪求帶啊";

int color = Color.BLUE;

@Nullable
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    View view = inflater.inflate(R.layout.fragment_first, container, false);
    ButterKnife.inject(this, view);
    return view;
}

@Override
public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
    super.onViewCreated(view, savedInstanceState);

    Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher);

    SpannableStringBuilder builder = new SpannableStringBuilder();
    for (String name : names) {
        String text = String.format("%s回復%s:%sicon\n", name, host, comment);
        SpannableString string = new SpannableString(text);
        string.setSpan(new ForegroundColorSpan(color), 0, name.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
        string.setSpan(new ForegroundColorSpan(color), name.length() + 2, name.length() + 2 + host.length(),
                Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
        string.setSpan(new ImageSpan(bitmap), text.length() - 5, text.length() - 1, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
        builder.append(string);
    }

    textview.setText(builder);
}

@Override
public void onDestroyView() {
    super.onDestroyView();
    ButterKnife.reset(this);
}

}</pre> 
 
這是一個fragment，布局里面只有一個textview，textview沒有使用findviewByid進行初始化，使用的是開源工具butterknife。

然后就是一次賦值，每次評論玩后，進行回車。 

 String text = String.format(“%s回復%s:%sicon\n”, name, host, comment); 

 評論的內容是這樣的，第一個參數表示用戶名，第二個表示樓主，第三個表示內容，內容后面有個icon，我在這里只是對表情協議做簡單的處理，實際上每個應用的對應的表情協議都是不一樣的，使用特殊的字符串進行替換。
// 給name設置一個顏色
string.setSpan(new ForegroundColorSpan(color), 0, name.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
// 給host設置一個顏色
string.setSpan(new ForegroundColorSpan(color), name.length() + 2, name.length() + 2 + host.length(),
        Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
// 給icon進行替換，換成一個圖片
string.setSpan(new ImageSpan(bitmap), text.length() - 5, text.length() - 1, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
builder.append(string);
 
 
以上就是一個QQ空間的回復功能的大致技術思路。

補充
由于Android對SpannableString設計的不太友好，所以本人對SpannableString進行的二次封裝，叫做TextStylePlus，下面是github地址，歡迎各位前來討論，里面有個相關的代碼和demo，同時還對ImageSpan做了擴展，一般情況下，ImageSpan是替換的，如上面所示，字符串icon是被一個圖片替換的，但是有些情況下，需要顯示一個自定義的shape背景，那么就比較難搞。 

 TextStylePlus
下面是對上面的QQ空間回復功能，使用TextStylePlus進行實現。
public class SecondFragment extends Fragment {


@InjectView(R.id.textview)
TextView textview;

String host = "流水不腐";
String[] names = {"張三", "李四", "二狗子"};
String comment = "土豪求帶啊";

int color = Color.BLUE;

@Nullable
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    View view = inflater.inflate(R.layout.fragment_first, container, false);
    ButterKnife.inject(this, view);
    return view;
}

@Override
public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
    super.onViewCreated(view, savedInstanceState);

    StyleBuilder styleBuilder = new StyleBuilder();
    for (String name : names) {
        styleBuilder.addStyleItem(
                new TextStyleItem(name).setTextColor(color).setClickListener(new TextStyleItem.OnClickListener() {
                    @Override
                    public void onClick(String clickedText) {
                        Toast.makeText(SecondFragment.this.getActivity(), "text = " + clickedText, Toast.LENGTH_SHORT).show();
                    }
                }))
                .text("回復:")
                .addStyleItem(new TextStyleItem(host).setTextColor(color))
                .addStyleItem(new TextStyleItem("icon").setIconRes(R.drawable.ic_launcher))
                .newLine();
    }
    styleBuilder.show(textview);
}

@Override
public void onDestroyView() {
    super.onDestroyView();
    ButterKnife.reset(this);
}

}</pre> 
 
代碼比較簡單易懂，就是對回復的內容進行拼裝，類似于使用StringBuffer一樣，當最好拼裝完成好后，直接傳給textview進行顯示，同時擴展了點擊事件，當點擊某一個用戶的名字時，會彈出一個Toast，如下所示。

至此，本文基本技術，如需代碼示例，請訪問https://github.com/LiushuiXiaoxia/TextStylePlus ,項目里面共有三個子項目，libary表示TextStylePlus的庫，app是對libary的demo，qqComment是QQ空間回復的功能實現。
</div>