垂直seekbar在Android Studio中顯示爲水平的

Question

我想要實現一個垂直（直立）seekbar來控制音量。目前它顯示爲橫向顯示。下面的圖片與我想要實現的佈局類似。

點擊聲音按鈕後，當點擊聲音圖標時，應該打開控制音量的搜索欄。

誰能幫我解決這個問題？

下面是代碼：

<?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" 
android:orientation="vertical" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:isScrollContainer="true" 
android:id="@+id/r1"> 
<android.support.v7.widget.Toolbar 
xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="fill_parent" android:layout_height="wrap_content" 
android:background="#38538e" 
android:id="@+id/toolBar" 
android:fitsSystemWindows="true" 
android:theme="@style/ThemeOverlay.AppCompat.Dark" 
android:layout_alignBottom="@+id/horizontalScrollView" 
android:layout_marginLeft="45dp" 
android:layout_marginTop="7dp" 
android:layout_alignParentRight="true" 
android:layout_alignParentEnd="true"> 

</android.support.v7.widget.Toolbar> 


<LinearLayout 
    android:layout_width="wrap_content" android:layout_height="wrap_content" 
    android:layout_alignBottom="@+id/toolbartitle" 
    android:layout_toLeftOf="@+id/toolbartitle" 
    android:layout_toStartOf="@+id/toolbartitle" 
    android:id="@+id/linearLayout3" 
    android:orientation="horizontal"></LinearLayout> 

<HorizontalScrollView 
    android:layout_width="match_parent" android:layout_height="wrap_content" 
    android:id="@+id/horizontalScrollView" 
    android:fillViewport="false" 
    android:background="#ffffff" 
    android:layout_alignParentTop="true" 
    android:layout_alignParentLeft="true" 
    android:layout_alignParentStart="true" 
    android:scrollbars="none" 
    android:scrollbarAlwaysDrawHorizontalTrack="true" 
    android:contextClickable="false" 
    android:focusable="false" 
    android:layout_marginTop="80dp"> 




<RelativeLayout 
    android:layout_width="match_parent" android:layout_height="wrap_content" 
    android:background="#ffffff" 
    android:layout_alignTop="@+id/horizontalScrollView" 
    android:layout_alignParentLeft="true" 
    android:layout_alignParentStart="true"> 

    <RelativeLayout 
     android:layout_width="match_parent" android:layout_height="wrap_content" 
     android:id="@+id/miniscrollRelative" 
     android:layout_alignParentTop="true" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentStart="true"> 

     <TextView 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:text="@string/home" 
      android:id="@+id/textViewab" 
      android:layout_alignParentLeft="true" 
      android:layout_alignParentStart="true" 
      android:layout_marginLeft="20dp" 
      android:layout_marginTop="50dp" 
      android:textSize="8dp"/> 

     <TextView 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:text="@string/player" 
      android:id="@+id/textViewba" 
      android:layout_alignParentTop="true" 
      android:layout_alignParentLeft="true" 
      android:layout_alignParentStart="true" 
      android:layout_marginLeft="70dp" 
      android:layout_marginTop="50dp" 
      android:textSize="8dp" /> 
     <TextView 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:text="@string/Your_play.." 
      android:id="@+id/textViewca" 
      android:layout_alignParentTop="true" 
      android:layout_alignParentLeft="true" 
      android:layout_alignParentStart="true" 
      android:layout_marginLeft="130dp" 
      android:layout_marginTop="50dp" 
      android:textSize="8dp" /> 
     <TextView 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:text="@string/downloads" 
      android:id="@+id/textViewda" 
      android:layout_alignParentTop="true" 
      android:layout_alignParentLeft="true" 
      android:layout_alignParentStart="true" 
      android:layout_marginLeft="200dp" 
      android:layout_marginTop="50dp" 
      android:textSize="8dp" /> 
     <TextView 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:textAppearance="?android:attr/textAppearanceSmall" 
      android:text="@string/streaming" 
      android:id="@+id/textViewea" 
      android:layout_alignParentTop="true" 
      android:layout_alignParentLeft="true" 
      android:layout_alignParentStart="true" 
      android:layout_marginLeft="270dp" 
      android:layout_marginTop="50dp" 
      android:textSize="8dp" /> 
     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtonhomea" 
      android:src="@drawable/homenew" 
      android:background="#ffffff" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp" 
      android:layout_alignBottom="@+id/imageButtonda" 
      android:layout_toRightOf="@+id/imageButtonaab" 
      android:layout_toEndOf="@+id/imageButtonaab" /> 

     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtonaa" 
      android:src="@drawable/player" 
      android:layout_marginLeft="60dp" 
      android:background="#ffffff" 
      android:layout_marginTop="10dp" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp"/> 
     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtonaab" 
      android:src="@drawable/player_active" 
      android:layout_marginLeft="60dp" 
      android:background="#ffffff" 
      android:layout_marginTop="10dp" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp" 
      android:visibility="gone"/> 

     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtonba" 
      android:src="@drawable/mydownload" 
      android:layout_marginLeft="195dp" 
      android:background="#ffffff" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp" 
      android:layout_marginTop="10dp"/> 
     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtonbab" 
      android:src="@drawable/download_active" 
      android:layout_marginLeft="195dp" 
      android:background="#ffffff" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp" 
      android:layout_marginTop="10dp" 
      android:visibility="gone"/> 
     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtonca" 
      android:src="@drawable/playlist" 
      android:layout_marginLeft="130dp" 
      android:background="#ffffff" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp" 
      android:layout_marginTop="10dp" 
      /> 
     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtoncab" 
      android:src="@drawable/playlist_active" 
      android:layout_marginLeft="130dp" 
      android:background="#ffffff" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp" 
      android:layout_marginTop="10dp" 
      android:visibility="gone"/> 
     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtonda" 
      android:src="@drawable/streaming" 
      android:layout_marginLeft="265dp" 
      android:background="#ffffff" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp" 
      android:layout_marginTop="10dp"/> 
     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtondab" 
      android:src="@drawable/streaming_active" 
      android:layout_marginLeft="265dp" 
      android:background="#ffffff" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp" 
      android:layout_marginTop="10dp" 
      android:visibility="gone"/> 


    </RelativeLayout> 
    <RelativeLayout 
     android:layout_width="match_parent" android:layout_height="wrap_content" 
     android:layout_toRightOf="@+id/miniscrollRelative" 
     android:layout_marginLeft="30dp"> 
     <TextView 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:textAppearance="?android:attr/textAppearanceSmall" 
      android:text="@string/send_wishes" 
      android:id="@+id/textViewfa" 
      android:textSize="8dp" 
      android:layout_marginLeft="8dp" 
      android:layout_marginTop="50dp" 
      /> 
     <TextView 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:textAppearance="?android:attr/textAppearanceSmall" 
      android:text="@string/hit_parade" 
      android:id="@+id/textViewga" 
      android:textSize="8dp" 
      android:layout_marginLeft="78dp" 
      android:layout_marginTop="50dp" 
      /> 
     <TextView 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:textAppearance="?android:attr/textAppearanceSmall" 
      android:text="@string/uzbek_instr" 
      android:id="@+id/textViewha" 
      android:textSize="8dp" 
      android:layout_marginLeft="145dp" 
      android:layout_marginTop="50dp" 
      /> 
     <TextView 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:textAppearance="?android:attr/textAppearanceSmall" 
      android:text="@string/your_news" 
      android:id="@+id/textViewia" 
      android:textSize="8dp" 
      android:layout_marginLeft="220dp" 
      android:layout_marginTop="50dp" 
      /> 
     <TextView 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:textAppearance="?android:attr/textAppearanceSmall" 
      android:text="@string/extras" 
      android:id="@+id/textViewja" 
      android:textSize="8dp" 
      android:layout_marginLeft="300dp" 
      android:layout_marginTop="50dp" 
      android:layout_marginRight="5dp"/> 
     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtonea" 
      android:src="@drawable/wishes" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp" 
      android:background="#ffffff" 
      android:layout_alignTop="@+id/imageButtonfa" 
      android:layout_alignParentLeft="true" 
      android:layout_alignParentStart="true" /> 
     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtoneab" 
      android:src="@drawable/hitparadea" 
      android:layout_marginLeft="10dp" 
      android:layout_marginTop="10dp" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp" 
      android:background="#ffffff" 
      android:visibility="gone"/> 
     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtonfa" 
      android:src="@drawable/hitparade" 
      android:layout_marginLeft="80dp" 
      android:layout_marginTop="10dp" 
      android:background="#ffffff" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp"/> 
     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtonfab" 
      android:src="@drawable/hitparade1" 
      android:layout_marginLeft="80dp" 
      android:layout_marginTop="10dp" 
      android:background="#ffffff" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp" 
      android:visibility="gone"/> 
     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtonga" 
      android:src="@drawable/instrument" 
      android:layout_marginLeft="150dp" 
      android:layout_marginTop="10dp" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp" 
      android:background="#ffffff"/> 
     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtongab" 
      android:src="@drawable/instrument_active" 
      android:layout_marginLeft="150dp" 
      android:layout_marginTop="10dp" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp" 
      android:background="#ffffff" 
      android:visibility="gone"/> 
     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtonha" 
      android:src="@drawable/news" 
      android:layout_marginLeft="220dp" 
      android:layout_marginTop="10dp" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp" 
      android:background="#ffffff"/> 
     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtonhab" 
      android:src="@drawable/news_active" 
      android:layout_marginLeft="220dp" 
      android:layout_marginTop="10dp" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp" 
      android:background="#ffffff" 
      android:visibility="gone"/> 
     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtonia" 
      android:src="@drawable/extras" 
      android:layout_marginLeft="290dp" 
      android:layout_marginTop="10dp" 
      android:background="#ffffff" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp" 
      android:layout_marginRight="5dp"/> 
     <ImageButton 
      android:layout_width="wrap_content" android:layout_height="wrap_content" 
      android:id="@+id/imageButtoniab" 
      android:src="@drawable/extras_active" 
      android:layout_marginLeft="290dp" 
      android:layout_marginTop="10dp" 
      android:background="#ffffff" 
      android:paddingLeft="10dp" 
      android:paddingBottom="10dp" 
      android:paddingRight="10dp" 
      android:paddingTop="8dp" 
      android:layout_marginRight="5dp" 
      android:visibility="gone"/> 



    </RelativeLayout> 



</RelativeLayout> 
</HorizontalScrollView> 
<ImageButton 
    android:layout_height="wrap_content" 
    android:layout_width="wrap_content" 
    android:background="@drawable/right" 
    android:layout_alignParentRight="true" 
    android:layout_alignParentEnd="true" 
    android:layout_alignBottom="@+id/horizontalScrollView" 
    android:layout_alignTop="@+id/toolBar" 
    android:id="@+id/right" /> 
<ImageButton 
    android:id="@+id/left" 
    android:layout_height="wrap_content" 
    android:layout_width="wrap_content" 
    android:background="@drawable/left" 
    android:layout_alignParentLeft="true" 
    android:layout_alignParentStart="true" 
    android:layout_alignBottom="@+id/horizontalScrollView" 
    android:layout_alignTop="@+id/toolBar" /> 
<FrameLayout 
    android:layout_width="match_parent" android:layout_height="match_parent" 
    android:name="android.app.ListFragment" 
    android:id="@+id/fragment" 
    android:background="#ffffff" 
    android:layout_below="@+id/horizontalScrollView" 
    android:layout_alignRight="@+id/toolBar" 
    android:layout_alignEnd="@+id/toolBar"> 

    <FrameLayout 
     android:background="#f2434242" 
     android:layout_width="match_parent" 
     android:layout_height="202dp" 
     android:layout_gravity="left|bottom"> 
     <ImageView 
      android:layout_width="49dp" 
      android:layout_height="49dp" 
      android:background="@drawable/playerbar"/> 

     <RelativeLayout 
      android:layout_width="match_parent" 
      android:layout_height="263dp" 
      android:layout_gravity="left|center_vertical"> 

      <ToggleButton 
       android:background="@drawable/minipause" 
       android:textOn="" 
       android:textOff="" 
       android:src="@drawable/mini" 
       android:layout_width="35dp" 
       android:layout_height="35dp" 
       android:id="@+id/button2" 
       android:layout_gravity="center_horizontal|top" 
       android:layout_marginRight="29dp" 
       android:layout_marginEnd="29dp" 
       android:layout_alignTop="@+id/textView5" 
       android:layout_toLeftOf="@+id/button4" 
       android:layout_toStartOf="@+id/button4" /> 

      <Button 
       android:background="@drawable/minisound" 
       android:layout_width="35dp" 
       android:layout_height="35dp" 
       android:id="@+id/button4" 
       android:layout_gravity="center_horizontal|top" 
       android:layout_alignTop="@+id/button2" 
       android:layout_alignParentRight="true" 
       android:layout_alignParentEnd="true" /> 

      <SeekBar 
       android:layout_width="match_parent" 
       android:layout_height="2dp" 
       android:id="@+id/seekBar2" 
       android:layout_weight="0.87" 
       android:progress="100" 
       android:progressDrawable="@drawable/seekbar3" 
       android:max="200" 
       android:thumb="@null" 
       android:maxHeight="3dp" 
       android:paddingLeft="10dp" 
       android:paddingRight="10dp" 
       android:layout_below="@+id/button2" 
       android:layout_alignParentLeft="true" 
       android:layout_alignParentStart="true" 
       android:layout_marginTop="30dp" /> 

      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="Radio" 
       android:textColor="#ffffff" 
       android:id="@+id/textView5" 
       android:layout_alignParentTop="true" 
       android:layout_alignParentLeft="true" 
       android:layout_alignParentStart="true" 
       android:layout_marginLeft="54dp" 
       android:layout_marginStart="54dp" 
       android:layout_marginTop="38dp" /> 

      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="UZ" 
       android:textColor="#ffffff" 
       android:id="@+id/textView6" 
       android:layout_below="@+id/textView5" 
       android:layout_alignLeft="@+id/textView5" 
       android:layout_alignStart="@+id/textView5" /> 

     </RelativeLayout> 

    </FrameLayout> 

</FrameLayout> 

<TextView 
    android:layout_width="match_parent" android:layout_height="50dp" 
    android:text="player" 

    android:textSize="22sp" 
    android:gravity = "center" 
    android:id="@+id/toolbartitle" 
    android:layout_above="@+id/toolBar" 
    android:layout_alignLeft="@+id/toolBar" 
    android:layout_alignStart="@+id/toolBar" /> 

Answer 1

你可以試試下面的庫來創建一個自定義垂直搜索條，

dependencies { 
    compile 'com.h6ah4i.android.widget.verticalseekbar:verticalseekbar:0.7.0' 
} 

要在XML佈局中使用，

<!-- This library requires pair of the VerticalSeekBar and VerticalSeekBarWrapper classes --> 
<com.h6ah4i.android.widget.verticalseekbar.VerticalSeekBarWrapper 
    android:layout_width="wrap_content" 
    android:layout_height="150dp"> 
    <com.h6ah4i.android.widget.verticalseekbar.VerticalSeekBar 
     android:id="@+id/mySeekBar" 
     android:layout_width="0dp" 
     android:layout_height="0dp" 
     android:splitTrack="false" 
     app:seekBarRotation="CW90" /> <!-- Rotation: CW90 or CW270 --> 
</com.h6ah4i.android.widget.verticalseekbar.VerticalSeekBarWrapper> 

參考：https://github.com/h6ah4i/android-verticalseekbar

更新：要定製搜索條，你需要添加機器人：拇指 & 安卓progressDrawable。首先，創建以下可繪製到繪製文件夾，

seekbar_background

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item> 
     <shape android:shape="rectangle"> 
      <solid android:color="#404040" /> 
      <corners android:radius="40dp" /> 
     </shape> 
    </item> 
</selector> 

seekbar_progress

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="line"> 
    <stroke 
     android:width="4dp" 
     android:color="#777777" /> 
</shape> 

搜索條

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item 
     android:id="@android:id/background" 
     android:drawable="@drawable/seekbar_background" 
     android:left="2dp"> 
    </item> 
    <item android:id="@android:id/progress"> 
     <clip android:drawable="@drawable/seekbar_progress" /> 
    </item> 
</layer-list> 

最後，

seekbar_thumb

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item> 
     <shape android:shape="oval"> 
      <solid android:color="#7FD319" /> 
      <size 
       android:width="15dp" 
       android:height="15dp" /> 
     </shape> 
    </item> 
</layer-list> 

現在用拇指 & progreeDrawable更新您的搜索條，

<!-- This library requires pair of the VerticalSeekBar and VerticalSeekBarWrapper classes --> 
     <com.h6ah4i.android.widget.verticalseekbar.VerticalSeekBarWrapper 
      android:layout_width="wrap_content" 
      android:layout_height="match_parent" 
      android:layout_gravity="center"> 

      <com.h6ah4i.android.widget.verticalseekbar.VerticalSeekBar 
       android:id="@+id/opacity_seek" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:background="@null" 
       android:progressDrawable="@drawable/seekbar" 
       android:splitTrack="false" 
       android:thumb="@drawable/seekbar_thumb_green" 
       app:seekBarRotation="CW270" /> <!-- Rotation: CW90 or CW270 --> 
     </com.h6ah4i.android.widget.verticalseekbar.VerticalSeekBarWrapper> 

Answer 2

請在您的代碼添加android:rotation="270"它會工作

 <SeekBar 
      android:layout_width="match_parent" 
      android:layout_height="2dp" 
      android:id="@+id/seekBar2" 
      android:layout_weight="0.87" 
      android:progress="100" 
      android:progressDrawable="@drawable/seekbar3" 
      android:max="200" 
      android:thumb="@null" 
      android:maxHeight="3dp" 
      android:paddingLeft="10dp" 
      android:paddingRight="10dp" 
      android:layout_below="@+id/button2" 
      android:layout_alignParentLeft="true" 
      android:layout_alignParentStart="true" 
      android:layout_marginTop="30dp" 
      android:rotation="270"/> 

將definitly作品，嘗試