首页 文章

Android中的圆形按钮

提问于
浏览
59

我想在Android程序中创建圆形按钮 . 我看了How to create EditText with rounded corners?

我想要实现的是:

  • 圆形边缘按钮

  • 更改不同状态下的按钮背景/外观(如Onclick,Focus)

  • 使用我自己的PNG作为背景而不是创建形状 .

9 回答

  • 58

    您可以执行圆角按钮而无需使用ImageView .

    后台选择器资源 button_background.xml

    <?xml version="1.0" encoding="utf-8" ?> 
         <selector xmlns:android="http://schemas.android.com/apk/res/android">
         <!--  Non focused states 
          --> 
          <item android:state_focused="false" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/button_unfocused" /> 
          <item android:state_focused="false" android:state_selected="true" android:state_pressed="false" android:drawable="@drawable/button_unfocused" /> 
         <!--  Focused states 
          --> 
          <item android:state_focused="true" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/button_focus" /> 
          <item android:state_focused="true" android:state_selected="true" android:state_pressed="false" android:drawable="@drawable/button_focus" /> 
         <!--  Pressed 
          --> 
          <item android:state_pressed="true" android:drawable="@drawable/button_press" /> 
        </selector>
    

    对于每个州,一个可绘制的资源,例如, button_press.xml:

    <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
      <stroke android:width="1dp" android:color="#FF404040" /> 
      <corners android:radius="6dp" /> 
      <gradient android:startColor="#FF6800" android:centerColor="#FF8000" android:endColor="#FF9700" android:angle="90" /> 
    </shape>
    

    注意 corners 属性,这会让你圆角!

    然后在按钮上设置背景drawable:

    android:background="@drawable/button_background"
    

    EDIT (9/2018) :可以使用相同的技术创建圆形按钮 . 圆形实际上只是一个方形按钮,半径大小设置为方形边的1/2

    此外,在上面的示例中 strokegradient 不能看到圆角形状

  • 1

    如果您需要Android中的圆角按钮,则创建一个XML文件“RoundShapeBtn.xml”作为drawable .

    <?xml version="1.0" encoding="utf-8"?>
      <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" android:padding="10dp">   
      <solid android:color="#6E6E6E"/> <!-- this one is ths color of the Rounded Button -->
      <corners
       android:bottomRightRadius="10dp"
       android:bottomLeftRadius="10dp"
       android:topLeftRadius="10dp"
       android:topRightRadius="10dp"/>
    </shape>
    

    将其添加到您的按钮代码:

    android:background="@drawable/RoundShapeBtn"
    
  • 11

    在android中的drawable文件夹中创建xml文件,如:

    rounded_button.xml

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
           android:shape="rectangle">
    
        <corners android:radius="20dp"/> // if you want clear round shape then make radius size is half of your  button`s height.
        <solid android:color="#EEFFFFFF"/> // Button Colour
        <padding
            android:bottom="5dp"
            android:left="10dp"
            android:right="10dp"
            android:top="5dp"/>
    
    </shape>
    

    现在这个xml文件作为你的按钮背景 .

    <Button
            android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:background="@drawable/rounded_button"
            android:text="@string/button_text"
            android:textColor="@color/black"/>
    
  • 4

    It is recommended by Google您没有模仿其他平台的UI元素 . 我不会在Android应用程序中放置圆形iOS样式按钮 .

  • 2

    像这样扩展 ImageView

    public class RoundedImageView extends ImageView {
      private static final String TAG = "RoundedImageView";
    
      private float mRadius = 0f;
    
      public RoundedImageView(Context context) {
        super(context);
      }
    
      public RoundedImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
    
        // retrieve styles attributes
        TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.RoundedView);
        mRadius = a.getDimension(R.styleable.RoundedView_radius, 0f);
        a.recycle();
      }
    
      @Override
      protected void onDraw(Canvas canvas) {
        // only do this if we actually have a radius
        if(mRadius > 0) {
          RectF rect = new RectF(0, 0, getWidth(), getHeight());
          Path clipPath = new Path();
          clipPath.addRoundRect(rect, mRadius, mRadius, Path.Direction.CW);
          canvas.clipPath(clipPath);
        }
        super.onDraw(canvas);
      }
    }
    

    并将正常的背景资源应用于它,它应该用圆角修剪 .

  • 7

    这可以使用corner属性完成 . 看下面的xml .

    <item>
        <shape android:shape="rectangle" >
            <stroke
                android:height="1.0dip"
                android:width="1.0dip"
                android:color="#ffee82ee" />
    
            <solid android:color="#ffee82ee" />
    
            <corners
                android:bottomLeftRadius="102.0dip"
                android:bottomRightRadius="102.0dip"
                android:radius="102.0dip"
                android:topLeftRadius="102.0dip"
                android:topRightRadius="102.0dip" />
        </shape>
    </item>
    
  • 105

    将按钮状态和形状放在1 xml选择器文件中要好得多 . 这应该会使您的应用程序运行得更快/更好 . 试试这个(由Android应用程序开发简介提供) . 这里没有垃圾邮件只是显示这不是我的代码 .

    <?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="rectangle"  >
         <corners android:radius="12dip" />
         <stroke android:width="1dip" android:color="#333333" />
         <gradient android:angle="-90" android:startColor="#333333"      android:endColor="#555555"  />            
        </shape>
        </item>
        <item android:state_focused="true">
        <shape android:shape="rectangle"  >
         <corners android:radius="12dip" />
         <stroke android:width="1dip" android:color="#333333" />
         <solid android:color="#58857e"/>       
        </shape>
        </item>  
        <item >
        <shape android:shape="rectangle"  >
         <corners android:radius="12dip" />
         <stroke android:width="1dip" android:color="#333333" />
         <gradient android:angle="-90" android:startColor="#333333" android:endColor="#555555" />            
        </shape>
        </item>
    
        </selector>
    

    P.S.-设计提示:渐变和圆角矩形最好用,当你很难说它们在那里 - 明智地使用 .

  • 0

    圆形按钮也可以使用环形可绘制创建,请参阅http://www.zoftino.com/android-shape-drawable-examples

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:innerRadius="0dp"
        android:shape="ring"
        android:thickness="40dp"
        android:useLevel="false">
        <solid android:color="@color/colorPrimary" />
        <padding android:bottom="50dp"
            android:left="16dp"
            android:right="16dp"
            android:top="50dp"/>
    </shape>
    
  • 0

    创建名为btnOval的可绘制资源 - >然后过去的代码;

    <?xml version="1.0" encoding="utf-8"?>
          <shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="oval"  
    android:padding="10dp">   
          <solid android:color="#6E6E6E"/> 
        </shape>
    

    和按钮标签内的用户一样,

    <Button
    andorid:width=""
    android:hieght=""
    android:background="@Drawable/btnOval"
    />
    

相关问题