안드로이드로 채워진 원에 문자열(TextView)을 표시해 보십시오.

11399 단어 AndroidTextView

개요

이렇게'색칠한 원의 중앙에 숫자를 표시하고 싶다'는 주문을 받고 이를 실현하는 방법에 대해 조사

Shape Drawarble을 사용해 보십시오.


TextView의background에서android:shape="oval"android:shape="ring"Shape Drawable를 지정하는 방법을 시도합니다.
oval_background.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="@android:color/holo_blue_bright" />
</shape>
ring_background.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="ring"
    android:useLevel="false">
    <solid android:color="@android:color/holo_blue_bright" />
</shape>
activity_circle_textview.xml
<?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="wrap_content"
    android:orientation="horizontal">

    <android.support.v4.widget.Space
        android:layout_width="10dp"
        android:layout_height="10dp" />

    <android.support.v7.widget.AppCompatTextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/oval_background"
        android:gravity="center"
        android:padding="4dp"
        android:text="め"
        android:textColor="@android:color/black" />

    <android.support.v4.widget.Space
        android:layout_width="10dp"
        android:layout_height="10dp" />

    <android.support.v7.widget.AppCompatTextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/ring_background"
        android:gravity="center"
        android:padding="4dp"
        android:text="組"
        android:textColor="@android:color/black" />
</LinearLayout>
CircleTextViewActivity.java
package jp.co.package.example;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v7.app.AppCompatActivity;

/**
 * 円の中に文字を表示する TextView のサンプル
 */
public class CircleTextViewActivity extends AppCompatActivity {
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_circle_textview);
    }
}

결실


  • android:shape="oval"의 경우 채우기 및 padding가 반영되지만 치수를 wrap_content로 설정하면 원이 아닌 타원형이 됩니다.
  • android:shape="ring"의 경우 문자와 같이 동그라미이지만 이를 채울 수 없습니다.또한 상술한 문법은 반영할 수 없음padding
  • Equal Width Height TextView를 사용해 보세요.


    Stack Overflow의 대답하다.에서 참조하여 항목으로 복사해 보십시오.
    텍스트가 10이 안 될 때android:gravit="center"에서 가운데에 있을 때android:inputType="number"를 추가해야 합니다
    EqualWidthHeightTextView 반명이지만 스퀘어 텍스뷰라고 불러도 될 것 같아요.

    결실


    그림은 생략된 문자열을 원에 표시할 수 있습니다.

    Circular TextView를 사용해 보세요.


    Stack Overflow의 대답하다.에서 참조하여 항목으로 복사해 보십시오.
    <?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">
    
        <jp.co.package.example.CircularTextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:padding="4dp"
            android:text="俺"
            android:textColor="@android:color/white" />
    
        ︙
        ︙
        ︙
    
    </LinearLayout>
    

    결실

    android:layout_width="wrap_content"android:layout_height="wrap_content"의 상태에서 문자를 원에 표시할 수 있습니다.
    하지만 엔화의 제작이 좀 느릴 수 있다는 것에 신경을 썼다.

    부가가치

    circularTextView.setStrokeWidth(2);
    circularTextView.setStrokeColor("#da721c");
    
    Stroke를 설정할 수도 있습니다.

    결점


    조우 사례는 안드로이드 7.0(Nougat의 터미널 설정>[고명암비 글씨체] 켜진 후CircularTextView 팽창한 사례

    총결산


    개인 추천 사용EqualWidthHeightTextView

    좋은 웹페이지 즐겨찾기