【发布时间】：2012-05-03 05:47:22
【问题描述】：
我正在尝试制作一个圆形按钮，但我不知道该怎么做。我可以制作带圆角的按钮，但我怎样才能圆圆。这是不一样的。请告诉我，在Android上可以吗？谢谢你。
【问题讨论】：
-
谷歌有新框架，新技术更好Jetpack Compose
【发布时间】：2012-05-03 05:47:22
【问题描述】：
在drawable文件夹中创建一个名为roundedbutton.xml的xml文件
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#eeffffff" />
<corners android:bottomRightRadius="8dp"
android:bottomLeftRadius="8dp"
android:topRightRadius="8dp"
android:topLeftRadius="8dp"/>
</shape>
最后将其设置为Button 的背景为android:background = "@drawable/roundedbutton"
如果您想让它完全变圆，请更改半径并选择适合您的东西。
【讨论】：
-
你需要.xml后缀吗？我见过一个没有的例子
-
在drawable这个词之前不需要'@'符号？
-
另外，为什么不使用 android:shape="oval"
-
您也可以为所有角指定 1 个半径大小
-
将半径设为 90dp 以制作全圆形按钮
如果使用 Android Studio，您可以使用：
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="#FFFFFF"/>
</shape>
这对我来说很好，希望这对某人有所帮助。
【讨论】：
-
这应该是公认的答案，使用角值不会超出圆角，这个问题是关于一个圆的。感谢肖恩的回答
-
使用
ring不会显示任何内容。最好使用oval。
-
创建一个 drawable/button_states.xml 文件，其中包含：
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="false"> <shape android:shape="rectangle"> <corners android:radius="1000dp" /> <solid android:color="#41ba7a" /> <stroke android:width="2dip" android:color="#03ae3c" /> <padding android:bottom="4dp" android:left="4dp" android:right="4dp" android:top="4dp" /> </shape> </item> <item android:state_pressed="true"> <shape android:shape="rectangle"> <corners android:radius="1000dp" /> <solid android:color="#3AA76D" /> <stroke android:width="2dip" android:color="#03ae3c" /> <padding android:bottom="4dp" android:left="4dp" android:right="4dp" android:top="4dp" /> </shape> </item> </selector> -
在任何布局文件的按钮标签中使用它
<Button android:layout_width="220dp" android:layout_height="220dp" android:background="@drawable/button_states" android:text="@string/btn_scan_qr" android:id="@+id/btn_scan_qr" android:textSize="15dp" />
【讨论】：
-
它工作得很好，谢谢。你能帮我画一个从圆心到圆外的矩形，看起来像一个'Q'
-
工作正常，但为什么我们将半径设置为 1000dp？你能解释一下吗？
-
@JamshaidKamran 1000dp 是任意大小，足以使按钮变圆。
-
有没有可以代替1000dp的Android维度资源？
Markushi's android circlebutton:
（此库已弃用，没有新的开发发生。考虑使用 FAB。）
【讨论】：
-
警告：已弃用！
如果你想要一个看起来像 FAB 的圆形按钮，并且你正在使用官方的材料组件库，你可以像这样轻松地做到这一点：
<com.google.android.material.button.MaterialButton
style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
app:cornerRadius="28dp"
android:layout_width="56dp"
android:layout_height="56dp"
android:text="1" />
结果：
如果更改按钮的大小，请注意将按钮大小的一半用作app:cornerRadius。
【讨论】：
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid
android:color="#ffffff"
/>
</shape>
在您的 XML 可绘制资源上设置它，以及使用您的可绘制作为背景的简单使用和带有圆形图像的图像按钮。
【讨论】：
<corners android:bottomRightRadius="180dip"
android:bottomLeftRadius="180dip"
android:topRightRadius="180dip"
android:topLeftRadius="180dip"/>
<solid android:color="#6E6E6E"/> <!-- this one is ths color of the Rounded Button -->
并将其添加到按钮代码中
android:layout_width="50dp"
android:layout_height="50dp"
【讨论】：
使用椭圆形。这使按钮变成椭圆形
<item>
<shape android:shape="oval" >
<stroke
android:height="1.0dip"
android:width="1.0dip"
android:color="#ffee82ee" />
<solid android:color="#ffee82ee" />
<corners
android:bottomLeftRadius="12.0dip"
android:bottomRightRadius="12.0dip"
android:radius="12.0dip"
android:topLeftRadius="12.0dip"
android:topRightRadius="12.0dip" />
</shape>
</item>
【讨论】：
您可以使用圆形背景图片制作ImageButton。
【讨论】：
使用 ImageButton 代替 Button....
制作带有透明背景的圆形图片
【讨论】：
您可以使用MaterialButton：
<com.google.android.material.button.MaterialButton
android:layout_width="48dp"
android:layout_height="48dp"
android:insetTop="0dp"
android:insetBottom="0dp"
android:text="A"
app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlay.App.Rounded"
/>
并通过以下方式应用通知ShapeAppearanceOverlay：
<style name="ShapeAppearanceOverlay.App.rounded" parent="">
<item name="cornerSize">50%</item>
</style>
【讨论】：
为圆形按钮创建一个形状：
<?xml version="1.0" encoding="utf-8"?>
<stroke
android:width="8dp"
android:color="#FFFFFF" />
<solid android:color="#ffee82ee" />
<corners
android:bottomLeftRadius="45dp"
android:bottomRightRadius="45dp"
android:topLeftRadius="45dp"
android:topRightRadius="45dp" />
将其用作按钮的背景link
【讨论】：
是的，有可能，在谷歌上寻找 9-patch。好文章：
http://radleymarx.com/blog/simple-guide-to-9-patch/
http://ogrelab.ikratko.com/custom-color-buttons-for-android/
【讨论】：
我只是使用FloatingActionButton 和elevation = 0dp 来消除阴影：
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_send"
app:elevation="0dp" />
【讨论】：
-
FAB 的问题是它不能使用透明和全彩色图像，只能使用黑白矢量。恕我直言
2021 年更新：
只需使用 MaterialButton
<com.google.android.material.button.MaterialButton
app:cornerRadius="30dp"
android:layout_width="60dp"
android:layout_height="60dp"
android:text="test" />
- 宽等高
- cornerRadius 是宽度或高度的一半
【讨论】：
是的
android.R.drawable.expander_ic_minimized
查看内置的 android drawables：
【讨论】：
你可以使用google的FloatingActionButton
XML：
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@android:drawable/ic_dialog_email" />
Java：
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
FloatingActionButton bold = (FloatingActionButton) findViewById(R.id.fab);
bold.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
// Do Stuff
}
});
}
分级：
compile 'com.android.support:design:23.4.0'
【讨论】：
- 使用图像按钮，将背景设为您想要的图像。
- 从 android assets studio 链接创建图像 -
然后下载它，提取它，在里面寻找 mipmap-hdpi 文件夹。
从 mipmap-hdpi 文件夹中复制图像并将其粘贴到您的 android 项目的 drwable 文件夹中。
现在将背景设置为该图像。
【讨论】：
我浏览了所有答案。但是它们都不是初学者友好的。所以在这里我给出了一个非常详细的答案，并用图片进行了充分的解释。
打开 Android Studio。转到Project Window并滚动到res文件夹下的drawable文件夹
右键，选择新建 --> 可绘制资源文件夹
在出现的窗口中，将文件命名为rounded_corners，然后点击OK
创建了一个新文件rounded_corners.xml
打开文件。您将看到以下代码-->
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://android.com/apk/res/android">
</selector>
将其替换为以下代码-->
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="8dp" />
<solid android:color="#66b3ff" />
</shape>
这里可以在右侧看到设计视图
调整android:radius 中的值，使按钮或多或少圆润。
那就去activity_main.xml
输入如下代码-->
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:padding="10dp">
<Button
android:id="@+id/_1"
android:text="1"
android:textSize="25dp"
android:textColor="#ffffff"
android:background="@drawable/rounded_corners"
android:layout_width="50dp"
android:layout_height="wrap_content"
android:layout_margin="20dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"/>
</RelativeLayout>
在这里，我将Button 放在RelativeLayout 中。你可以使用任何你想要的Layout。
供参考MainActivity.java代码如下-->
import android.app.Activity;
import android.os.Bundle;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}
我安装了 Pixel 4 API 30 avd。 运行avd中的代码后显示如下-->
【讨论】：
圆形。
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#FFFFFF" />
<stroke
android:width="1dp"
android:color="#F0F0F0" />
<corners
android:radius="90dp"/>
</shape>
编码愉快！
【讨论】：
如果有人需要一个浮动动作按钮，但不想依赖整个材质库，这里有一个看起来完全相同的最小实现，有波纹动画、阴影和show()/hide()带有动画的方法。
小部件代码：
class CircularImageButton @JvmOverloads constructor(
context: Context,
attrs: AttributeSet? = null,
) : AppCompatImageButton(context, attrs) {
init {
background = null
outlineProvider = pillOutlineProvider
clipToOutline = true
}
fun show() {
if (visibility != VISIBLE) {
visibility = VISIBLE
startAnimation(showAnimation)
}
}
fun hide() {
if (visibility != INVISIBLE) {
visibility = INVISIBLE
startAnimation(hideAnimation)
}
}
override fun setBackgroundColor(color: Int) {
if (backgroundPaint.color != color) {
backgroundPaint.color = color
invalidate()
}
}
private val backgroundPaint = Paint().apply { style = Paint.Style.FILL }
override fun onDraw(canvas: Canvas?) {
canvas?.drawPaint(backgroundPaint)
super.onDraw(canvas)
}
}
val pillOutlineProvider = object : ViewOutlineProvider() {
override fun getOutline(view: View, outline: Outline) {
outline.setRoundRect(0, 0, view.width, view.height, view.height.f / 2)
}
}
private val animationDuration = applicationContext
.resources.getInteger(android.R.integer.config_shortAnimTime).toLong()
val showAnimation = ScaleAnimation(
0f, 1f, 0f, 1f,
Animation.RELATIVE_TO_SELF, 0.5f,
Animation.RELATIVE_TO_SELF, 0.5f)
.apply { duration = animationDuration }
val hideAnimation = ScaleAnimation(
1f, .5f, 1f, 0.5f,
Animation.RELATIVE_TO_SELF, 0.5f,
Animation.RELATIVE_TO_SELF, 0.5f)
.apply { duration = animationDuration }
还有 xml，其中 40dp 是 FAB 的“迷你”版本。
<CircularImageButton
android:id="@+id/fab"
android:layout_width="40dp"
android:layout_height="40dp"
android:src="@drawable/ic_your_drawable"
android:scaleType="center"
android:layout_margin="12dp"
android:elevation="3dp"
android:outlineAmbientShadowColor="#7000"
android:outlineSpotShadowColor="#7000"
android:foreground="?attr/selectableItemBackgroundBorderless" />
【讨论】：
我喜欢这个解决方案
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:cardCornerRadius="18dp"
app:cardElevation="0dp"
>
<ImageButton
android:layout_width="35dp"
android:layout_height="35dp"
android:background="@null"
android:scaleType="centerCrop"
android:src="@drawable/social_facebook"
/>
</androidx.cardview.widget.CardView>
【讨论】：