如何在Android UI中绘制圆角矩形?

I need to draw a rounded rectangle in the Android UI. Having the same rounded rectangle for TextView and EditText would also be helpful.

我需要在Android UI中画一个圆角矩形。为TextView和EditText设置相同的圆角矩形也很有帮助。

5 个解决方案

#1

158

In your layout xml do the following:

在您的xml布局中，请执行以下操作:

   <shape xmlns:android="http://schemas.android.com/apk/res/android">
         <gradient
            android:endColor="@color/something"
            android:centerColor="@color/something_else"
            android:startColor="@color/something_else_still"
            android:angle="270" />
        <corners
            android:radius="3dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />
    </shape>

By changing the android:radius you can change the amount of "rounding" of the corners.

通过修改android:radius，您可以修改角的“圆”量。

#2

I think, this is you exactly needed.

我想，这正是你所需要的。

Here drawable(xml) file that creates rounded rectangle. round_rect_shape.xml

在这里，可绘制(xml)文件，创建圆形矩形。round_rect_shape.xml

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

    <solid android:color="#ffffff" />

    <corners
        android:bottomLeftRadius="8dp"
        android:bottomRightRadius="8dp"
        android:topLeftRadius="8dp"
        android:topRightRadius="8dp" />

</shape>

Here layout file: my_layout.xml

这里的布局文件:my_layout.xml

<LinearLayout
    android:id="@+id/linearLayout1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/round_rect_shape"
    android:orientation="vertical"
    android:padding="5dp" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Something text"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:textColor="#ff0000" />

    <EditText
        android:id="@+id/editText1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <requestFocus />
    </EditText>
</LinearLayout>

-> In the above code, LinearLayout having the background(That is the key role to place to create rounded rectangle). So you can place any view like TextView, EditText... in that LinearLayout to see background as round rectangle for all.

->在上述代码中，线性布局具有背景(这是创建圆形矩形的关键角色)。你可以放置任何视图，比如TextView, EditText…在那种线性布局中，所有的背景都是圆形矩形。

#3

In monodroid, you can do like this for rounded rectangle, and then keeping this as a parent class, editbox and other layout features can be added.

在monodroid中，可以对圆角矩形这样做，然后将其作为父类，可以添加editbox和其他布局特性。

 class CustomeView : TextView
    {
       public CustomeView (Context context, IAttributeSet ) : base (context, attrs)  
        {  
        }
       public CustomeView(Context context, IAttributeSet attrs, int defStyle) : base(context, attrs, defStyle)  
        {  
        }
       protected override void OnDraw(Android.Graphics.Canvas canvas)
       {
           base.OnDraw(canvas);
           Paint p = new Paint();
           p.Color = Color.White;
           canvas.DrawColor(Color.DarkOrange);

           Rect rect = new Rect(0,0,3,3);

           RectF rectF = new RectF(rect);


           canvas.DrawRoundRect( rectF, 1,1, p);



       }  
    }
}

#4

If you want to use the rounded rectangle as a background for the TextView and EditText you should use custom background. You need to use the shape component for this for more info read this question Using shape drawable as my background xml

如果您想使用圆角矩形作为TextView和EditText的背景，您应该使用自定义背景。要获得更多信息，需要使用shape组件来获取更多信息，请将这个问题用作我的背景xml

#5

<shape xmlns:android="http://schemas.android.com/apk/res/android"
  android:padding="10dp"
  android:shape="rectangle">
    <solid android:color="@color/colorAccent" /> 
    <corners
      android:bottomLeftRadius="500dp"
      android:bottomRightRadius="500dp"
      android:topLeftRadius="500dp"
      android:topRightRadius="500dp" />
</shape>

Now, in which element you want to use this shape just add: android:background="@drawable/custom_round_ui_shape"

现在，在需要使用这个形状的元素中添加:android:background="@drawable/custom_round_ui_shape"

Create a new XML in drawable named "custom_round_ui_shape"

用可绘制的名称“custom_round_ui_shape”创建一个新的XML

#1

158