wie kreisförmige Fortschrittsanzeige um eine Schaltfläche zu implementieren?

Question

Ich habe viele Möglichkeiten ausprobiert, um das folgende Beispiel zu implementieren, aber ich konnte es nicht universell arbeiten lassen.

Ich habe bereits den folgenden Bildschirm fertig gebaut. Ich habe rechts ausgerichtet und vertikal zentriert. und eine gewisse Marge gegeben.

Mein Problem ist, ich den onpressed Zustand für diese hinzufügen müssen, und ich brauche einen Kreis Fortschritt wie unten Screenshot hinzuzufügen.

Ich weiß nicht, wie in diesem besonderen Ort, den Kreis Fortschritte zu implementieren. Ich habe versucht, den Fortschritt von der linken Mittelsenkrechten zu implementieren, habe etwas Spielraum gegeben und diesen korrigiert. aber wenn ich es in großen Bildschirmen installiere, läuft die Ausrichtung falsch. Also habe ich versucht, es von der rechten Mitte vertikal zu implementieren und gab dafür einen Rand bis zu diesem Kreis. Aber selbst das hat nicht funktioniert.

pls helfen mir jemand aus, wie dieses Problem zu beheben :(

Ich bin für mehr als eine Woche mit diesem geschlagen :(

EDIT: Der XML-Code:

<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" /> 

Answer 1

ich habe mit einem XML-Beispiel Layout rumgespielt einen ähnlichen Effekt zu erhalten, die Sie suchen. auf diesem Screenshot und Code Werfen Sie einen Blick.

Die XML, um das Layout zu erreichen, wird unten eingefügt. Offensichtlich können Sie es wie Sie wollen stylen.

<?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>