如何在按钮周围实现圆形进度指示器？答案

【问题标题】：how to implement circular progress indicator around a button?如何在按钮周围实现圆形进度指示器？
【发布时间】：2012-08-23 12:27:36
【问题描述】：

我已经尝试了很多方法来实现下面的例子，但我不能让它普遍工作。

我已经完成了以下屏幕的构建。我已经向右对齐并垂直居中。并给予一定的余量。

我的问题是我必须为此添加onpressed 状态，并且我需要添加如下截图所示的循环进度。

我不知道如何在那个特定的地方实施这种循环进展。我尝试从左中心垂直实现进度并给出一些边距并修复它。但是当我将它安装在大屏幕上时，对齐会出错。所以我尝试从右中心垂直实现它，并为那个圆圈留出余量。但即使这样也没有用。

请有人帮助我，如何解决这个问题:(

我被这个震惊了一个多星期:(

编辑： XML 代码：

<ProgressBar
        android:id="@+id/ProgressBar01"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:background="@drawable/circular_progress"
        android:layout_marginRight="185dp"
        android:progress="50" />

    <ImageButton
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:background="@null"
        android:src="@drawable/tap_to_capture" />

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:text="@string/tap_to_cap"
        android:textSize="12sp"
        android:textColor="#006666"
        android:layout_marginRight="25dp"
        android:textAppearance="?android:attr/textAppearanceSmall" />

【问题讨论】：

请向我们展示您的 XML 布局文件。
你能不能不把按钮和进度条包装在一个相对的布局中，然后把它们都设置在它们的父级中，这样它们的中间总是对齐？
嗨@brianestey，感谢您的回复。我上传的第一张图片是一张图片。我需要把它分开吗？如果是这样，我需要如何分开？我已经将加载和第一个条带放置在相对布局本身中。
我添加了一个答案，概述了我所描述的内容。如果有帮助，请接受它作为答案。

标签： android android-layout android-progressbar

【解决方案1】：

我使用了一个示例 XML 布局来获得您正在寻找的类似效果。看看这个截图和代码。

下面粘贴实现布局的XML。显然你可以随心所欲地设计它。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <RelativeLayout
        android:id="@+id/RelativeLayoutLeftButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <ProgressBar
            android:id="@+id/progressBar1"
            style="?android:attr/progressBarStyleLarge"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true" />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_play" />
    </RelativeLayout>

    <TextView
        android:id="@+id/textView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_toRightOf="@+id/RelativeLayoutLeftButton"
        android:text="Click Here"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:textColor="#006666"
        android:textSize="12sp" />

</RelativeLayout>

【讨论】：