溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章給大家介紹如何在Android中利用TextView實現自定義豎排，內容非常詳細，感興趣的小伙伴們可以參考借鑒，希望對大家能有所幫助。
測試用的Activity。
public class MainActivity extends Activity implements OnTouchListener {
private VerticalTextView mVerticalTextView;
private TextView mTextView;
private int mTextCount;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
mVerticalTextView = (VerticalTextView) findViewById(R.id.vertical_tv);
mTextView = (TextView) findViewById(R.id.content_tx);
mTextCount = mVerticalTextView.getText().length();
mVerticalTextView.setOnTouchListener(this);
mTextView.setBackgroundColor(Color.LTGRAY);
}
@Override
public boolean onTouch(View v, MotionEvent event) {
float verticalTextViewHeight = mVerticalTextView.getHeight();
float y = event.getY();
int sectionPosition = (int) Math.ceil((y / verticalTextViewHeight)
/ (1f / mTextCount)) - 1;
if (sectionPosition < 0) {
sectionPosition = 0;
} else if (sectionPosition >= mTextCount) {
sectionPosition = mTextCount - 1;
}
String sectionLetter = String.valueOf(mVerticalTextView.getText()
.charAt(sectionPosition));
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
mTextView.setVisibility(View.VISIBLE);
mTextView.setText(sectionLetter);
break;
case MotionEvent.ACTION_MOVE:
mTextView.setText(sectionLetter);
mTextView.setVisibility(View.VISIBLE);
break;
case MotionEvent.ACTION_UP:
mTextView.setVisibility(View.INVISIBLE);
default:
break;
}
return true;
}
}
這里主要說下如何通過點擊或者滑動左側的自定義TextView，將索引值取出來。主要的實現點在代碼：
float verticalTextViewHeight = mVerticalTextView.getHeight();
float y = event.getY();
int sectionPosition = (int) Math.ceil((y / verticalTextViewHeight)
/ (1f / mTextCount)) - 1;
if (sectionPosition < 0) {
sectionPosition = 0;
} else if (sectionPosition >= mTextCount) {
sectionPosition = mTextCount - 1;
}
String sectionLetter = String.valueOf(mVerticalTextView.getText()
.charAt(sectionPosition));
這里verticalTextViewHeight 是整個控件的高度，y按下控件后的y軸坐標，然后通過一個比例式將點擊位置換算成豎排索引字符集中的對應字符位置，通過這個位置就可以判斷出點擊的是哪一個索引字符了。這里要注意比例式中的運算要轉成浮點型計算，否則無法得到正確的索引值，樓主當時就在此深深的坑過。
下面是重點自定義TextView的實現代碼：
public class VerticalTextView extends TextView {
/**
* 繪制整個VerticalTextView區域大小的畫筆
*/
private Paint mPaint;
/**
* 繪制每個豎排字符間的間隔橫線的畫筆
*/
private Paint linePaint;
/**
* 繪制單個字符的畫筆
*/
private Paint charPaint;
private char[] indexs;
private int textCount;
private String textString;
public VerticalTextView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public VerticalTextView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
mPaint = new Paint();
linePaint = new Paint();
charPaint = new Paint();
textString = getText().toString();
indexs = getKeyChar(textString);
textCount = textString.toCharArray().length;
}
@Override
protected void onDraw(Canvas canvas) {
float childHeight = getHeight() / textCount;
if (TextUtils.isEmpty(textString))
return;
canvas.drawRect(0, 0, getWidth(), getHeight(), mPaint);
canvas.drawColor(Color.GRAY);
linePaint.setColor(Color.BLACK);
charPaint.setTextSize((float) (getWidth() * 0.75));
charPaint.setTextAlign(Paint.Align.CENTER);
FontMetrics fm = charPaint.getFontMetrics();
for (int i = 0; i < textCount; i++) {
canvas.drawLine(0, i * childHeight, getWidth(), i * childHeight,
linePaint);
canvas.drawText(
String.valueOf(indexs[i]),
getWidth() / 2,
(float) (((i + 0.5) * childHeight) - (fm.ascent + fm.descent) / 2),
charPaint);
}
}
protected char[] getKeyChar(String str) {
char[] keys = new char[str.length()];
for (int i = 0; i < keys.length; i++) {
keys[i] = str.charAt(i);
}
return keys;
}
}
代碼也很簡單，復寫了onDraw函數。將要顯示的字符串拆分成一個個字符放在一個數組中。通過一個循環遍歷這個數組，挨個將他們繪制出來。精華只有一句：
canvas.drawText(String.valueOf(indexs[i]),getWidth() / 2,(float) (((i + 0.5) * childHeight) - (fm.ascent + fm.descent) / 2 ),charPaint);
第一個參數是要繪制的字符，第二個參數繪制字符的x軸起始點，第三個參數比較復雜，重點說下前半部分
(i + 0.5) * childHeight
表示每個字符區域高度的一辦所在的y軸坐標，后半部分
(fm.ascent + fm.descent) / 2
這個是個矯正值，如果不跟上它，繪制出來的字符會整體靠上。這里要參考字符的繪制原理，明白了后就很簡單了。這里我就不在過多敘述。
最后是測試Activity的布局文件：
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<com.example.demoindextextview.widget.VerticalTextView
android:id="@+id/vertical_tv"
android:layout_width="20dp"
android:layout_height="match_parent"
android:layout_gravity="right"
android:text="ABCDEFGsdfsf你好嗎sdfsdklmnopqrstuvwxyz" />
<TextView
android:id="@+id/content_tx"
android:layout_gravity="center"
android:gravity="center"
android:layout_height="50dp"
android:layout_width="50dp"
android:textSize="30sp"
android:visibility="invisible"/>
</FrameLayout>
關于如何在Android中利用TextView實現自定義豎排就分享到這里了，希望以上內容可以對大家有一定的幫助，可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
