安卓圆形背景变成椭圆形的问题

Question

我想在TextView上放置一个圆形背景。当它被渲染时，圆形变成了椭圆形。

我的布局XML：

    <TextView
        android:id="@+id/amount_key"
        android:layout_weight="1"
        android:layout_height="match_parent"
        android:layout_width="match_parent"
        android:layout_marginRight="2dp"
        android:gravity="center"
        android:background="@drawable/circle"
        android:layout_marginLeft="20dp"
        android:text="3\ndays"
        android:padding="20dp"
        android:textColor="#ffffff"
        android:textStyle="bold"
        android:textSize="25dp" />


</LinearLayout>

我的圆形背景：

<shape 
    xmlns:android="http://schemas.android.com/apk/res/android"
            android:shape="oval">

            <solid 
               android:color="#79bfea"/>
</shape>

- nizam.sp

---

你应该将layout_weight和layout_height设置为固定值。@sudhasri下面的解决方案不起作用吗？ - nizam.sp

我已经通过扩展TextView覆盖了onMeasure来设置宽度为高度。 - Shirish Herwade

Answer 1

• 将您的textView的layout_height和layout_width更改为wrap_content
• 在形状标签内添加尺寸标签，如下所示

<shape 
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">> 
<solid android:color="#79bfea" />
<size android:height="25dp"
   android:width="25dp"/>
</shape>

如果还是椭圆形，请尝试增加 size 标签中的宽度和高度。这对我有用！

- Sudhasri

---

在我的情况下，将layout_height和layout_width设置为wrap_content并调整右侧填充即可解决问题。 - Gueorgui Obregon

@GueorguiObregon 这段文本是否居中？ - Sudhasri

Answer 2

您可以创建自己的Drawable，它将把半径限制为其宽度和高度之间的最小值。

package com.example.android;

import android.graphics.Canvas;
import android.graphics.ColorFilter;
import android.graphics.Paint;
import android.graphics.PixelFormat;
import android.graphics.Rect;
import android.graphics.drawable.Drawable;

public class ColorCircleDrawable extends Drawable {
    private final Paint mPaint;
    private int mRadius = 0;

    public ColorCircleDrawable(final int color) {
        this.mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        this.mPaint.setColor(color);
    }

    @Override
    public void draw(final Canvas canvas) {
        final Rect bounds = getBounds();
        canvas.drawCircle(bounds.centerX(), bounds.centerY(), mRadius, mPaint);
    }

    @Override
    protected void onBoundsChange(final Rect bounds) {
        super.onBoundsChange(bounds);
        mRadius = Math.min(bounds.width(), bounds.height()) / 2;
    }

    @Override
    public void setAlpha(final int alpha) {
        mPaint.setAlpha(alpha);
    }

    @Override
    public void setColorFilter(final ColorFilter cf) {
        mPaint.setColorFilter(cf);
    }

    @Override
    public int getOpacity() {
        return PixelFormat.TRANSLUCENT;
    }
}

然后将其应用于您的textView：

textView.setBackground(new ColorCircleDrawable(Color.RED));

- Alessandro Crugnola

---

为了获得一个空心圆环而不是一个实心圆，使用paint.setStyle(Paint.Style.STROKE)和paint.setStrokeWidth(strokeWidth)。 - Doug Voss

请确保像这样传递颜色：int colorToUse = ContextCompat.getColor(getContext(), R.color.my_color); textView.setBackground(new ColorCircleDrawable(colorToUse)); 而不是textView.setBackground(new ColorCircleDrawable(R.color.my_color)); - Pedro Hidalgo

Answer 3

为了达到这个效果

我使用了两个嵌套的LinearLayout，并将父布局的gravity设置为CENTER

<LinearLayout
android:layout_width="80dp"
android:layout_height="50dp"
android:baselineAligned="false"
android:gravity="center"
android:orientation="vertical">

<LinearLayout
    android:layout_width="45dp"
    android:layout_height="45dp"
    android:gravity="center"
    android:background="@drawable/oval"
    android:orientation="vertical">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="Text"
        android:textSize="12sp" />
</LinearLayout>
</LinearLayout>

这是位于drawable文件夹内的oval.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="#393939" />
    <size
        android:width="40dp"
        android:height="40dp" />
</shape>

没有内部 LinearLayout，你会得到这个：

它的代码如下：

<LinearLayout
android:layout_width="80dp"
android:layout_height="50dp"
android:baselineAligned="false"
android:gravity="center"
android:background="@drawable/oval"
android:orientation="vertical">

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:text="Text"
    android:textSize="12sp" />
</LinearLayout>

- Eftekhari

Answer 4

我扩展了TextView类，以将宽度设置为高度。

public class TextViewSquareShaped extends TextView {


public TextViewSquareShaped(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    init(attrs);
}

public TextViewSquareShaped(Context context, AttributeSet attrs) {
    super(context, attrs);
    init(attrs);

}

public TextViewSquareShaped(Context context) {
    super(context);
    init(null);
}

private void init(AttributeSet attrs) {
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    int width = getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec);
    setMeasuredDimension(width, width);
    Log.v("measure", "width:" + width + " height:" + width);
 }
}

结合Sudhasri之前的回答，我可以展示出精确的圆形文本视图。

因此不需要给定固定的高度和宽度。

- Shirish Herwade

---

java.lang.IllegalArgumentException: width and height must be > 0 - Vlad

Answer 5

由于您在宽度和高度上使用了“match_parent”，并将可绘制物设置为背景，因此它会呈椭圆形。要实现圆形，您可以为宽度和高度提供相同的尺寸。如果要全屏显示，则可以使用“WindowManager”从Java代码中获取宽度，并在宽度和高度上设置相同的值。

- Swetank

Answer 6

尝试使用环形而不是椭圆形。

<shape 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="ring" >

    <solid android:color="#79bfea" />
</shape>

- DevGuy