Android仿微信標(biāo)簽功能
更新時(shí)間：2018年12月07日 14:13:06 作者：qq402335257
這篇文章主要為大家詳細(xì)介紹了Android仿微信標(biāo)簽功能，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
微信中有對(duì)聯(lián)系人添加標(biāo)簽的功能，如下圖所示。
這里有三種狀態(tài)的標(biāo)簽，分別的未選擇，選中，編輯中，由于前兩種標(biāo)簽不需要提供輸入，所以用TextView實(shí)現(xiàn)即可，編輯中的標(biāo)簽用EditText來(lái)實(shí)現(xiàn)。而標(biāo)簽的形狀就用Shape來(lái)實(shí)現(xiàn)。
在drawable下新建xml文件，這里先上Shape的xml文件。
tag_normal.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<corners
android:bottomLeftRadius="10dp"
android:bottomRightRadius="10dp"
android:topLeftRadius="10dp"
android:topRightRadius="10dp" />
<stroke android:width="1dp" android:color="#66CDAA" />
<padding
android:bottom="4dp"
android:left="8dp"
android:right="8dp"
android:top="4dp" />
</shape>
tag_selected.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<corners
android:bottomLeftRadius="10dp"
android:bottomRightRadius="10dp"
android:topLeftRadius="10dp"
android:topRightRadius="10dp" />
<stroke android:width="1dp" android:color="#66CDAA" />
<padding
android:bottom="4dp"
android:left="8dp"
android:right="8dp"
android:top="4dp" />
</shape>
tag_edit.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<corners
android:bottomLeftRadius="10dp"
android:bottomRightRadius="10dp"
android:topLeftRadius="10dp"
android:topRightRadius="10dp" />
<!-- 這里實(shí)現(xiàn)虛線邊框-->
<stroke android:dashWidth="5dp" android:dashGap="2dp" android:width="1dp" android:color="#e0e0e0" />
<padding
android:bottom="4dp"
android:left="8dp"
android:right="8dp"
android:top="4dp" />
</shape>
接著在在布局文件中新建一個(gè)LinearLayout用以存放標(biāo)簽(如果要實(shí)現(xiàn)多行標(biāo)簽自適應(yīng)添加，用自定義的FlowLayout，代碼網(wǎng)上很多。)
activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/tag_container" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="horizontal" tools:context="com.qtree.tagdemo.MainActivity"> </LinearLayout>
根據(jù)對(duì)微信標(biāo)簽的分析，這里可以這樣實(shí)現(xiàn)，創(chuàng)建一個(gè)EditText，對(duì)其軟鍵盤的Enter和Delete按鍵進(jìn)行監(jiān)聽(tīng)，當(dāng)輸入完成后按下Enter則生成一個(gè)標(biāo)簽，添加到LinearLayout中。然后如果當(dāng)標(biāo)簽內(nèi)文字為空時(shí)，按下刪除鍵，就將它前一個(gè)標(biāo)簽的狀態(tài)修改為選中狀態(tài)。同樣地，當(dāng)點(diǎn)擊未選擇的標(biāo)簽也可以選中該標(biāo)簽進(jìn)行刪除。
詳細(xì)實(shí)現(xiàn)如下
package com.qtree.tagdemo;
import android.graphics.Color;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.text.Editable;
import android.text.TextWatcher;
import android.util.Log;
import android.view.KeyEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.EditText;
import android.widget.LinearLayout;
import android.widget.TextView;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
private LinearLayout layout;
private LinearLayout.LayoutParams params;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
layout=(LinearLayout)findViewById(R.id.tag_container);
params=new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
params.setMargins(30,30,0,0);
//存放標(biāo)簽和標(biāo)簽選擇狀態(tài)
final List<TextView> tagView=new ArrayList<>();
final List<Boolean> tagViewState=new ArrayList<>();
//創(chuàng)建編輯中的標(biāo)簽
final EditText editText=new EditText(getApplicationContext());
editText.setHint("添加標(biāo)簽");
//設(shè)置固定寬度
editText.setMinEms(4);
editText.setTextSize(12);
//設(shè)置shape
editText.setBackgroundResource(R.drawable.tag_edit);
editText.setHintTextColor(Color.parseColor("#b4b4b4"));
editText.setTextColor(Color.parseColor("#000000"));
editText.setLayoutParams(params);
//添加到layout中
layout.addView(editText);
//對(duì)軟鍵盤的Enter和Del鍵監(jiān)聽(tīng)
editText.setOnKeyListener(new View.OnKeyListener() {
@Override
public boolean onKey(View v, int keyCode, KeyEvent event) {
if (KeyEvent.ACTION_DOWN == event.getAction()) {
switch (keyCode) {
case KeyEvent.KEYCODE_ENTER:
String editTextContent = editText.getText().toString();
//判斷輸入是否為空
if (editTextContent.equals(""))
return true;
//判斷標(biāo)簽是否重復(fù)添加
for(TextView tag:tagView){
String tempStr=tag.getText().toString();
if(tempStr.equals(editTextContent)) {
Log.e("tag","重復(fù)添加");
editText.setText("");
editText.requestFocus();
return true;
}
}
//添加標(biāo)簽
final TextView temp = getTag(editText.getText().toString());
tagView.add(temp);
tagViewState.add(false);
//添加點(diǎn)擊事件，點(diǎn)擊變成選中狀態(tài)，選中狀態(tài)下被點(diǎn)擊則刪除
temp.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
int curIndex = tagView.indexOf(temp);
if (!tagViewState.get(curIndex)) {
//顯示 ×號(hào)刪除
temp.setText(temp.getText() + " ×");
temp.setBackgroundResource(R.drawable.tag_selected);
temp.setTextColor(Color.parseColor("#ffffff"));
//修改選中狀態(tài)
tagViewState.set(curIndex, true);
} else {
layout.removeView(temp);
tagView.remove(curIndex);
tagViewState.remove(curIndex);
}
}
});
layout.addView(temp);
//讓編輯框在最后一個(gè)位置上
editText.bringToFront();
//清空編輯框
editText.setText("");
editText.requestFocus();
return true;
case KeyEvent.KEYCODE_DEL:
int lastIndex = tagView.size() - 1;
//沒(méi)有添加標(biāo)簽則不繼續(xù)執(zhí)行
if (lastIndex < 0)
return false;
//獲取前一個(gè)標(biāo)簽
TextView prevTag = tagView.get(lastIndex);
//第一次按下Del鍵則變成選中狀態(tài)，選中狀態(tài)下按Del鍵則刪除
if (tagViewState.get(lastIndex)) {
tagView.remove(prevTag);
tagViewState.remove(lastIndex);
layout.removeView(prevTag);
} else {
String te = editText.getText().toString();
if (te.equals("")) {
prevTag.setText(prevTag.getText() + " ×");
prevTag.setBackgroundResource(R.drawable.tag_selected);
prevTag.setTextColor(Color.parseColor("#ffffff"));
tagViewState.set(lastIndex, true);
}
}
break;
}
}
return false;
}
});
//監(jiān)聽(tīng)編輯標(biāo)簽的輸入事件
editText.addTextChangedListener(new TextWatcher() {
@Override
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
}
@Override
public void onTextChanged(CharSequence s, int start, int before, int count) {
//輸入文字時(shí)取消已經(jīng)選中的標(biāo)簽
for (int i = 0; i < tagViewState.size(); i++) {
if (tagViewState.get(i)) {
TextView tmp = tagView.get(i);
tmp.setText(tmp.getText().toString().replace(" ×", ""));
tagViewState.set(i, false);
tmp.setBackgroundResource(R.drawable.tag_normal);
tmp.setTextColor(Color.parseColor("#66CDAA"));
}
}
}
@Override
public void afterTextChanged(Editable s) {
}
});
}
/**
* 創(chuàng)建一個(gè)正常狀態(tài)的標(biāo)簽
* @param tag
* @return
*/
private TextView getTag(String tag){
TextView textView=new TextView(getApplicationContext());
textView.setTextSize(12);
textView.setBackgroundResource(R.drawable.tag_normal);
textView.setTextColor(Color.parseColor("#66CDAA"));
textView.setText(tag);
textView.setLayoutParams(params);
return textView;
}
}
效果挺好。
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
您可能感興趣的文章:
- Android定時(shí)器實(shí)現(xiàn)定時(shí)執(zhí)行、重復(fù)執(zhí)行、定時(shí)重復(fù)執(zhí)行、定次數(shù)執(zhí)行的多種方式
- android如何取得本地通訊錄的頭像的原圖的實(shí)現(xiàn)代碼
- android的ListView點(diǎn)擊item使item展開(kāi)的做法的實(shí)現(xiàn)代碼
- Android單一實(shí)例全局可調(diào)用網(wǎng)絡(luò)加載彈窗
- Android帶刷新時(shí)間顯示的PullToRefresh上下拉刷新
- Android中LayoutInflater.inflater()的正確打開(kāi)方式
- Android加載loading對(duì)話框的功能及實(shí)例代碼(不退出沉浸式效果)
- Android實(shí)現(xiàn)動(dòng)態(tài)添加標(biāo)簽及其點(diǎn)擊事件
- Android實(shí)現(xiàn)外部喚起應(yīng)用跳轉(zhuǎn)指定頁(yè)面的方法
- Android中buildToolVersion與CompileSdkVersion的區(qū)別
相關(guān)文章
android使用surfaceview＋MediaPlayer播放視頻
這篇文章主要為大家詳細(xì)介紹了android使用surfaceview＋MediaPlayer播放視頻，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-11-11
基于Android XML解析與保存的實(shí)現(xiàn)
本篇文章小編為大家介紹，基于Android XML解析與保存的實(shí)現(xiàn)。需要的朋友參考下2013-04-04
這篇文章主要介紹了淺談Android LruCache的緩存策略，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-04-04
Android 斷點(diǎn)續(xù)傳原理以及實(shí)現(xiàn)
這篇文章主要介紹了Android 斷點(diǎn)續(xù)傳原理以及實(shí)現(xiàn)的相關(guān)資料,這里對(duì)斷點(diǎn)續(xù)傳原理進(jìn)行了詳細(xì)介紹，需要的朋友可以參考下2016-12-12
Android實(shí)現(xiàn)帶有指示器的自定義底部導(dǎo)航欄
這篇文章主要為大家詳細(xì)介紹了Android實(shí)現(xiàn)帶有指示器的自定義底部導(dǎo)航欄，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-04-04
Java和Android的LRU緩存及實(shí)現(xiàn)原理
本文主要介紹 Java和Android的LRU緩存及實(shí)現(xiàn)原理，這里整理了詳細(xì)的資料，有興趣的小伙伴可以參考下便于學(xué)習(xí)理解2016-08-08
android屏幕全屏的實(shí)現(xiàn)代碼，需要的朋友可以參考一下2013-05-05
設(shè)計(jì)簡(jiǎn)單的Android圖片加載框架
這篇文章主要為大家詳細(xì)介紹了Android圖片加載框架的簡(jiǎn)單設(shè)計(jì),具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-09-09
Android 啟動(dòng)第三方程序的方法總結(jié)
這篇文章主要介紹了Android 啟動(dòng)第三方程序的方法總結(jié)的相關(guān)資料,需要的朋友可以參考下2017-04-04
這篇文章主要介紹了Android ViewPager的事件沖突的解決辦法的相關(guān)資料,需要的朋友可以參考下2017-06-06