Android - 在进度条的中心显示文本答案

【问题标题】：Android - displaying text in center of progress barAndroid - 在进度条的中心显示文本
【发布时间】：2013-08-26 23:40:26
【问题描述】：

我已经制作了一个水平进度条，效果很好。我想在它的中间显示一个文本视图或类似的东西，在加载条时显示倒计时。请记住，它不是进度对话框，进度条位于活动内并显示倒数计时器。谁能帮助我，最好的方法是什么？我该如何完成？

【问题讨论】：

标签： android progress-bar

【解决方案1】：

这里我使用的是框架布局并将文本放在框架布局中

 <FrameLayout
        android:id="@+id/frameLayout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="30dp"
        map:layout_constraintBottom_toBottomOf="@+id/programStatusTextView"
        map:layout_constraintStart_toEndOf="@+id/programStatusTextView"
        map:layout_constraintTop_toTopOf="@+id/programStatusTextView">

        <RelativeLayout
            android:layout_width="130dp"
            android:layout_height="60dp"
            android:background="@drawable/battery">

            <ProgressBar
                android:id="@+id/batteryIndicaterBar"
                style="@style/CustomProgressBarHorizontal"
                android:layout_width="119dp"
                android:layout_height="52dp"
                android:layout_marginStart="3dp"
                android:layout_marginTop="4dp"
                android:layout_marginEnd="7dp"
                android:backgroundTint="@color/colorPrimary"
                android:max="100"
                android:minHeight="10dip"
                android:paddingEnd="4dp"
                android:progress="0"
                android:progressBackgroundTintMode="src_over"
                android:progressTint="@color/green"
                android:visibility="visible" />

        </RelativeLayout>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="0"
            android:textSize="20sp"
            android:textStyle="bold" />

    </FrameLayout>

这是我得到的输出

【讨论】：

【解决方案2】：

您可以在其中设置 LinearLayout 和 RelativeLayout 并制作 RelativeLayout Height & width 等于 wrap_content 然后在 ProgressBar 下的 TextView 中添加 android:layout_centerInParent="true"强>

例子：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center">
        <ProgressBar
            android:id="@+id/progressBar"
            android:layout_width="200dp"
            android:layout_height="200dp"
            android:max="100"
            android:progress="65" />
        <TextView
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:layout_centerInParent="true"
            android:textColor="@color/white"
            android:text="6:00 AM"
            android:textSize="25sp"
            android:textStyle="bold"/>
    </RelativeLayout>
</LinearLayout>

【讨论】：

【解决方案3】：

您可以将 ProgressBar 和 TextView 放在相对布局中，并将以下行添加到这两个子 XML 文件中：

android:layout_centerInParent="true"

这应该强制 ProgressBar 和 TextView 都显示在同一个相对布局的中心。

如果您想在 Circular ProgressBar 中显示文本字段，这也可以工作。

PS。如果您还想在进度条上方或下方（垂直）显示 textview，则可以调整 TextView 的“margin”元素。

【讨论】：

【解决方案4】：

Source tutorial

在 Activity 中，我们可以使用以下方法显示和关闭 ProgressBar

// Method to show Progress bar
private void showProgressDialogWithTitle(String substring) {
    progressDialog.setProgressStyle(ProgressDialog.STYLE_SPINNER);
    //Without this user can hide loader by tapping outside screen
    progressDialog.setCancelable(false);
    progressDialog.setMessage(substring);
    progressDialog.show();
}

// Method to hide/ dismiss Progress bar
private void hideProgressDialogWithTitle() {
    progressDialog.setProgressStyle(ProgressDialog.STYLE_SPINNER);
    progressDialog.dismiss();
}

检查其他

【讨论】：

您的链接提供了有关 ProgressDialog 的操作方法，已弃用。问题是询问ProgressBar，这是完全不同的事情。

【解决方案5】：

这是我用来在以 Web 视图为中心的微调器上方显示进度文本的方式：

<?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="match_parent">

    <WebView
        android:id="@+id/help_webview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="#F22"
        android:scrollbars="none" />


    <ProgressBar
        android:id="@+id/progressBar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerInParent="true"
        android:layout_centerVertical="true" />

    <TextView
        android:id="@+id/progressBarMessage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Loading, please wait..."
        android:layout_centerInParent="true"
        android:layout_above="@id/progressBar"
        android:background="#00000000" />


</RelativeLayout>

【讨论】：

【解决方案6】：

这对我有用：

             <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent">
                  <ProgressBar
                      android:id="@+id/progressBar"
                      style="@android:style/Widget.ProgressBar.Horizontal"
                      android:progressDrawable="@drawable/customprogressbar"
                      android:layout_width="match_parent"
                      android:layout_height="match_parent"
                      android:max="100"/>

                  <TextView
                      android:id="@+id/progressBarinsideText"
                      android:layout_width="wrap_content"
                      android:layout_height="wrap_content"
                      android:layout_alignParentLeft="true"
                      android:layout_alignParentRight="true"
                      android:layout_centerVertical="true"
                      android:gravity="center"
                    />
              </RelativeLayout>

【讨论】：

【解决方案7】：

您可以使用 FrameLayout 在 ProgressBar 上显示 TextView：

...
<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ProgressBar
        android:id="@+id/progress"
        style="@android:style/Widget.ProgressBar.Horizontal"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:progressDrawable="@drawable/progressbar" />

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true" />
        ...
    </RelativeLayout>
</FrameLayout>

【讨论】：

很好的解决方案。不确定相对布局的用途——似乎是多余的。
@dazed FrameLayout 应该用于保存单个子视图，因为在不相互重叠的情况下以可缩放到不同屏幕尺寸的方式组织子视图可能很困难。但是，您可以使用 android:layout_gravity 属性将多个子项添加到 FrameLayout 并通过为每个子项分配重力来控制它们在 FrameLayout 中的位置。来源：developer.android.com/reference/android/widget/FrameLayout.htmlresume 中，RelativeLayout 更好，当你想放置许多视图并相对组织它们时。

【解决方案8】：

如果您的 ProgressBar 和 TextView 在 RelativeLayout 内，您可以给 ProgressBar 一个 id，然后使用该 ID 将 TextView 与 ProgressBar 对齐。然后它应该显示在ProgressBar 的顶部。确保背景是透明的，这样您仍然可以看到ProgressBar

例如：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >
    <ProgressBar
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        // other attributes
        android:id="@+id/PROGRESS_BAR"
    >
    <TextView
        android:background="#00000000" // transparent
        // other attributes
        android:layout_alignLeft="@id/PROGRESS_BAR"
        android:layout_alignTop="@id/PROGRESS_BAR"
        android:layout_alignRight="@id/PROGRESS_BAR"
        android:layout_alignBottom="@id/PROGRESS_BAR"
    >
</RelativeLayout>

【讨论】：

只有这个 android:layout_alignTop="@id/simpleProgressBar" 适合我。
很好的解决方案！
在 textView 和 ProgressBar 元素上需要结束标记
如果用户引入了字体缩放，就会出现问题。进度条边界不会环绕展开的文本。