代码之家  ›  专栏  ›  技术社区  ›  Janusz Daniel Rindt

如何在Android xml可绘制文件中定义圆形?

  •  567
  • Janusz Daniel Rindt  · 技术社区  · 14 年前

    遗憾的是,android.com上的文档没有涵盖Shape类的XML属性。我想我应该使用 ArcShape 画一个圆,但没有解释如何设置大小,颜色,或角度需要使一个圆出一个弧。

    13 回复  |  直到 4 年前
        1
  •  1673
  •   Arefin    12 年前

    <?xml version="1.0" encoding="utf-8"?>
    <shape
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval">
    
       <solid 
           android:color="#666666"/>
    
       <size 
           android:width="120dp"
            android:height="120dp"/>
    </shape>
    
        2
  •  821
  •   M. Reza Nasirloo    6 年前

    将此设置为视图背景

    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval">
        <stroke
            android:width="1dp"
            android:color="#78d9ff"/>
    </shape>
    

    enter image description here

    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval">
        <solid
            android:color="#48b3ff"/>
    </shape>
    

    enter image description here

    带笔划的实心:

    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval">
        <solid android:color="#199fff"/>
        <stroke
            android:width="2dp"
            android:color="#444444"/>
    </shape>
    

    enter image description here

    注意 oval 形状显示为圆形,在这些示例中,使用此形状作为背景的视图应该是正方形,或者必须设置 height width 将形状标记的属性设置为相等的值。

        3
  •  101
  •   Ravi Makvana    9 年前

    简单圆代码

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval">
            <solid android:color="#9F2200"/>
            <stroke android:width="2dp" android:color="#fff" />
            <size android:width="80dp" android:height="80dp"/>
    </shape>
    
        4
  •  49
  •   Slimane amiar    7 年前

    你可以用 VectorDrawable 具体如下:

    <?xml version="1.0" encoding="utf-8"?>
    <vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="200dp"
        android:height="200dp"
        android:viewportHeight="64"
        android:viewportWidth="64">
    
        <path
            android:fillColor="#ff00ff"
            android:pathData="M22,32
            A10,10 0 1,1 42,32
            A10,10 0 1,1 22,32 Z" />
    </vector>
    

    enter image description here

        5
  •  47
  •   goosemanjack    13 年前

    查看androidsdk示例。ApiDemos项目中有几个例子:

    • 黑盒.xml
    • 形状5.xml

    对于带有渐变填充的圆,它看起来像这样:

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval" >
        <gradient android:startColor="#FFFF0000" android:endColor="#80FF00FF"
                android:angle="270"/>
    </shape>
    
    
        6
  •  22
  •   João Vitor sunkehappy    6 年前
    <?xml version="1.0" encoding="utf-8"?>
    <shape 
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval">
    
        <!-- fill color -->
        <solid android:color="@color/white" />
    
        <!-- radius -->
        <stroke
            android:width="1dp"
            android:color="@color/white" />
    
        <!-- corners -->
        <corners
            android:radius="2dp"/>
    </shape>
    
        7
  •  19
  •   kip2    9 年前

    下面是一个简单的circle\u background.xml,用于pre material:

    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:state_pressed="true">
            <shape android:shape="oval">
                <solid android:color="@color/color_accent_dark" />
            </shape>
        </item>
        <item>
            <shape android:shape="oval">
                <solid android:color="@color/color_accent" />
            </shape>
        </item>
    </selector>
    

    可以与属性一起使用 'android:background="@drawable/circle_background" 在按钮的布局定义中

        8
  •  19
  •   Paraskevas Ntsounos Charith Lakshitha    5 年前

    如果你想要一个 圆圈

    enter image description here

    尝试使用以下代码:

    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:innerRadius="0dp"
        android:shape="ring"
        android:thicknessRatio="2"
        android:useLevel="false" >
        <solid android:color="@android:color/white" />
        <stroke
            android:width="1dp"
            android:color="@android:color/darker_gray" />
    </shape>
    
        9
  •  15
  •   Martijn Pieters    5 年前

    res/drawble/circle\u shape.xml文件

    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item>
    
            <shape android:shape="oval">
                <solid android:color="#e42828"/>
                <stroke android:color="#3b91d7" android:width="5dp"/>
                <!-- Set the same value for both width and height to get a circular shape -->
                <size android:width="250dp" android:height="250dp"/>
            </shape>
        </item>
    </selector>
    

    enter image description here

        10
  •  11
  •   Aftab Alam    4 年前

    Android 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/white" />
        <stroke
            android:width="1.5dp"
            android:color="@android:color/holo_red_light" />
        <size
            android:width="120dp"
            android:height="120dp" />
    </shape>
    

    截图

    enter image description here

        11
  •  9
  •   Tiago Barreto    7 年前
    <?xml version="1.0" encoding="utf-8"?>
    <shape 
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval">
    
        <stroke
            android:width="10dp"
            android:color="@color/white"/>
    
        <gradient
            android:startColor="@color/red"
            android:centerColor="@color/red"
            android:endColor="@color/red"
            android:angle="270"/>
    
        <size 
            android:width="250dp" 
            android:height="250dp"/>
    </shape>
    
        12
  •  5
  •   krhitesh    6 年前

    你可以试试这个-

    <?xml version="1.0" encoding="utf-8"?>
    <shape
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="ring"
        android:innerRadiusRatio="700"
        android:thickness="100dp"
        android:useLevel="false">
    
        <solid android:color="#CCC" />
    
    </shape>
    

    此外,还可以通过调整 android:thickness .

    enter image description here

        13
  •  3
  •   Иво Недев    7 年前

    当你按下“Alt+7”键时,一个简单的文本视图会显示文本,这是一个完美的工作方式:

     <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="#0075bc"
                android:textSize="40dp"
                android:text="•"></TextView>
    
        14
  •  3
  •   Cyril David    5 年前

    <?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    
    <item>
        <shape
            android:innerRadius="0dp"
            android:shape="ring"
            android:thicknessRatio="2"
            android:useLevel="false" >
            <solid android:color="@color/button_blue_two" />
        </shape>
    </item>
    

    如果你在文本视图中使用它,你不必担心宽度和高度的纵横比

        15
  •  1
  •   Jinesh Francis    4 年前

    您可以创建一个自定义绘图来动态更改圆的颜色和半径

    import android.graphics.Canvas;
    import android.graphics.ColorFilter;
    import android.graphics.Paint;
    import android.graphics.PixelFormat;
    import android.graphics.drawable.Drawable;
    
    import androidx.annotation.NonNull;
    import androidx.annotation.Nullable;
    
    public class CircleDrawable extends Drawable {
    
        private Paint circlePaint;
        private int fillColor;
        private int strokeColor;
        private float radius;
    
        public CircleDrawable(int fillColor, int strokeColor, float radius) {
            this.fillColor = fillColor;
            this.strokeColor = strokeColor;
            this.radius = radius;
            circlePaint=new Paint(Paint.ANTI_ALIAS_FLAG);
        }
    
        @Override
        public void draw(@NonNull Canvas canvas) {
            int x=getBounds().centerX();
            int y=getBounds().centerY();
            //draw fill color circle
            circlePaint.setStyle(Paint.Style.FILL);
            circlePaint.setColor(fillColor);
            canvas.drawCircle(x,y,radius,circlePaint);
            // draw stroke circle
            circlePaint.setStyle(Paint.Style.STROKE);
            circlePaint.setColor(strokeColor);
            circlePaint.setStrokeWidth(5);
            canvas.drawCircle(x,y,radius,circlePaint);
        }
    
        @Override
        public void setAlpha(int alpha) {
            circlePaint.setAlpha(alpha);
        }
    
        @Override
        public void setColorFilter(@Nullable ColorFilter colorFilter) {
             circlePaint.setColorFilter(colorFilter);
        }
    
        @Override
        public int getOpacity() {
            return PixelFormat.TRANSLUCENT;
        }
    }
    

    imageView.setImageDrawable(new CircleDrawable(Color.RED,Color.YELLOW,100));
    

    输出如下

    enter image description here

        16
  •  0
  •   varun setia    6 年前
    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item>
            <shape android:shape="oval">
                <solid android:color="@color/text_color_green"/>
                <!-- Set the same value for both width and height to get a circular shape -->
                <size android:width="250dp" android:height="250dp"/>
            </shape>
        </item>
    </selector>
    
        17
  •  0
  •   Mujahid Khan    4 年前

    使用破折号尝试以下代码:

    <?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <size
        android:width="@dimen/_60sdp"
        android:height="@dimen/_60sdp" />
    
    <solid android:color="@color/black" />
    
    <stroke
        android:width="@dimen/_1sdp"
        android:color="@color/white"
        android:dashWidth="@dimen/_1sdp"
        android:dashGap="@dimen/_1sdp" />
    

    <?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    
    <size
        android:width="@dimen/_60sdp"
        android:height="@dimen/_60sdp" />
    
    <solid android:color="@color/black" />
    
    <stroke
        android:width="@dimen/_1sdp"
        android:color="@color/white"
         />
    

    Output without dash

    Out put

        18
  •  -20
  •   anon anon    14 年前

    只是使用

    ShapeDrawable circle = new ShapeDrawable( new  OvalShape() );