評論UI效果圖
圖1：沒有輸入評論內容，（0~300）始終顯示在最右邊，並且與該行提示內容保持在同一行
圖2：輸入評論內容時，後面文字數量文本跟着變化（215~300）始終顯示在最右邊，如果最後一行文本的寬度小於等於指定寬度，後面文 字數量文本和同一行的評論文本保持在同一行
圖3：輸入評論內容時，後面文字數量文本跟着變化（200~300）始終顯示在最右邊，如果最後一行文本的寬度 超出 指定寬度，後面文字數量文本顯示在最後一行的評論文本右下面
動態效果圖如下：
下面實現代碼
-
PixelUtils工具類
/** * 獲取屏幕的寬度 * * @param context * @return */ public static int getScreenWidth(Context context) { int widthPixels = context.getResources().getDisplayMetrics().widthPixels; return widthPixels; } /** * 將dip或dp值轉換爲px值，保證尺寸大小不變 * * @param dipValue * @return */ public static int dip2px(float dipValue) { final float scale = App.getAppContext().getResources().getDisplayMetrics().density; return (int) (dipValue * scale + 0.5f); } -
activity_editext佈局代碼
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:padding="@dimen/dp_22"> <ScrollView android:layout_width="match_parent" android:layout_height="@dimen/dp_140" android:layout_marginTop="@dimen/dp_50" android:scrollbars="none"> <RelativeLayout android:layout_width="match_parent" android:layout_height="@dimen/dp_140" android:background="@drawable/shanpe_rect_white_f7_radius4"> <EditText android:id="@+id/edit_comment" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@null" android:maxLength="300" android:gravity="top|left" android:hint="客官哪裏不滿意" android:paddingLeft="@dimen/dp_12" android:paddingTop="@dimen/dp_12" android:paddingRight="@dimen/dp_12" android:textColorHint="@color/warm_grey_9" android:textSize="@dimen/sp_14" /> <TextView android:id="@+id/tv_input_text_count1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignBottom="@+id/edit_comment" android:layout_alignParentRight="true" android:text="（0～300字）" android:textColor="@color/warm_grey_9" android:textSize="@dimen/sp_13" /> <TextView android:id="@+id/tv_input_text_count2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/edit_comment" android:layout_alignParentRight="true" android:text="（0～300字）" android:textColor="@color/warm_grey_9" android:textSize="@dimen/sp_13" android:visibility="gone" /> </RelativeLayout> </ScrollView> </LinearLayout> -
Java代碼
public class ActivityEditext extends AppCompatActivity { @BindView(R.id.edit_comment) EditText editComment; @BindView(R.id.tv_input_text_count1) TextView tvInputTextCount1; @BindView(R.id.tv_input_text_count2) TextView tvInputTextCount2; private int dp22; private int dp10; private int dp140; private int editextWidth; @Override protected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_editext); ButterKnife.bind(this); initData(); initEvent(); } private void initData() { dp22 = PixelUtils.dip2px(22); dp10 = PixelUtils.dip2px(10); dp140 = PixelUtils.dip2px(140); int screenWidth = PixelUtils.getScreenWidth(this); editextWidth = screenWidth - (dp22 * 2 + dp10 * 2); } private void initEvent() { // editComment.setMovementMethod(ScrollingMovementMethod.getInstance()); editComment.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) { } @Override public void afterTextChanged(Editable s) { /* if (s.length() > 300) { ToastUtils.show("已達字數最大限制"); return; }*/ if (s.length() == 300) {// 佈局裏添加 android:maxLength="300"，大於300時也只會取前300個字符，當內容始終是大於或者等於300個字符時，只回調一次 ToastUtils.show("已達字數最大限制"); } if (s.length() > 0) { tvInputTextCount1.setText("（" + s.length() + "/300字）"); tvInputTextCount2.setText("（" + s.length() + "/300字）"); } else { tvInputTextCount1.setText("（0～300字）"); tvInputTextCount2.setText("（0～300字）"); } Layout layout = editComment.getLayout(); int lineCount = layout.getLineCount(); int editCommentHeight = editComment.getHeight(); float lineWidth = layout.getLineWidth(lineCount - 1);// 獲取文本最後一行寬度 int tvInputTextCount1width = 0; if (tvInputTextCount1.getVisibility() == View.VISIBLE) { tvInputTextCount1width = tvInputTextCount1.getWidth(); } else if (tvInputTextCount2.getVisibility() == View.VISIBLE) { tvInputTextCount1width = tvInputTextCount2.getWidth(); } int contentWidth = editextWidth - tvInputTextCount1width; contentWidth = PixelUtils.px2dip(contentWidth); lineWidth = PixelUtils.px2dip(lineWidth); if (lineWidth <= contentWidth) { tvInputTextCount1.setVisibility(View.VISIBLE); tvInputTextCount2.setVisibility(View.GONE); } else if (editCommentHeight > dp140 && lineWidth <= contentWidth) { tvInputTextCount1.setVisibility(View.VISIBLE); tvInputTextCount2.setVisibility(View.GONE); } else { tvInputTextCount1.setVisibility(View.GONE); tvInputTextCount2.setVisibility(View.VISIBLE); } } }); } }
注意：
示例核心代碼是在afterTextChanged方法裏，如果onTextChanged裏實現，計算過於頻繁。