Search code examples
androidhandleseekbarslidingdrawer

Seekbar in SlidingDrawer's handle


I'm trying to make a music-player where i use almost all the area on the screen for the playlist. On the bottom of the scrren you'll see a small "player" with play/pause button, seekbar and then stop button. If you drag the "player" up, it will show you album-cover and some more information.

so, i got the layout done, but i can't move the thumb of the seekbar. I'm thinking that this is because it's a part of the handle of the slidingdrawer. If i'm right, is there any other way of doing this?

Here is my code for the layout of the slidingdrawer

 <SlidingDrawer
                android:id="@+id/slidingDrawer1"
                android:layout_width="match_parent"
                android:layout_height="450dp"
                android:layout_gravity="bottom"
                android:content="@+id/content"
                android:handle="@+id/handle" >

                <TableRow
                android:id="@+id/handle"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/hz_background_gradient"
                android:orientation="vertical" >

<LinearLayout
    android:id="@+id/linearLayout5"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal" >


    <ImageView
        android:id="@+id/imageButton1"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:src="@drawable/playback_play"
        android:layout_marginLeft="6dp"
        android:layout_marginTop="4dp" />

        <SeekBar android:id="@+id/editText1"
        android:layout_width="203dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_weight="0.45"
        android:layout_marginTop="8dp"
        android:max="100" />
    <ImageView
        android:id="@+id/imageButton1"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:src="@drawable/playback_stop"
        android:layout_marginLeft="6dp"
        android:layout_marginTop="4dp"
        android:layout_marginRight="5dp" />
</LinearLayout>

            </TableRow>


                <LinearLayout
                    android:id="@+id/content"
                    android:layout_width="match_parent"
                    android:layout_height="167dp"
                    android:orientation="vertical" >

                    <ImageView
                        android:id="@+id/imageView1"
                        android:layout_width="wrap_content"
                        android:layout_height="272dp"
                        android:layout_weight="0.83"
                        android:src="@drawable/ic_launcher"
                        android:layout_marginLeft="25dp"
                        android:layout_marginRight="25dp"
                        android:layout_marginTop="25dp" />



                    <TableRow
                        android:id="@+id/tbR1"
                        android:layout_width="fill_parent"
                        android:layout_height="wrap_content"
                        android:layout_weight="0.98"
                        android:background="@drawable/hz_background_gradient"
                        android:orientation="vertical" >

                        <LinearLayout
                            android:id="@+id/linearLayout5"
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:orientation="vertical" >
                        <LinearLayout
                            android:id="@+id/linearLayout5"
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:orientation="horizontal" >

                            <TextView
                                android:id="@+id/textView1"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:text="Titel: "
                                android:textAppearance="?android:attr/textAppearanceMedium" />


                            <TextView
                                android:id="@+id/tvTitel"
                                android:layout_width="match_parent"
                                android:layout_height="wrap_content"
                                android:text="Put a spell on you"
                                android:textAppearance="?android:attr/textAppearanceMedium" />

                        </LinearLayout>
                                                    <LinearLayout
                            android:id="@+id/linearLayout5"
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:orientation="horizontal" >

                            <TextView
                                android:id="@+id/textView1"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:text="Artist: "
                                android:textAppearance="?android:attr/textAppearanceMedium" />
                                                            <TextView
                                android:id="@+id/tvArtist"
                                android:layout_width="match_parent"
                                android:layout_height="wrap_content"
                                android:text="Credence Clearwater Revival"
                                android:textAppearance="?android:attr/textAppearanceMedium" />

                        </LinearLayout>
                      </LinearLayout>
                    </TableRow>
                </LinearLayout>
            </SlidingDrawer>

Thanks in advance :)


Solution

  • Okey. So, i fixed it! The reason to why i couldn't get it to work was because i was moving the handle. So, i needed to lock it when i (possible) would like to move then thumb if the seekbar. This is my solution:

    I added a "tab" on the leftTop side of the handle.

    This is my XML code for the SlidingDrawer now

           <SlidingDrawer
                    android:id="@+id/slidingDrawer1"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_gravity="bottom"
                    android:allowSingleTap="false"
                    android:content="@+id/content"
                    android:handle="@+id/handle" >
    
             <LinearLayout
        android:id="@+id/handle"
        android:layout_width="match_parent"
        android:layout_height="68dp"
        android:orientation="vertical" >
    
    
                   <TableRow
                            android:layout_width="101px"
                            android:layout_height="wrap_content"
                            android:background="@drawable/test"
                            android:orientation="vertical" >
                                                                         <TextView
                                    android:id="@+id/tvToggleSD"
                                    android:layout_width="match_parent"
                                    android:layout_height="wrap_content"
                                    android:text="Visa"
                                    android:layout_marginLeft="12dp"
                                    android:textAppearance="?android:attr/textAppearanceMedium" />
    
                                     </TableRow>  
                                          <TableRow
                            android:layout_width="fill_parent"
                            android:layout_height="wrap_content"
                            android:background="@drawable/hz_background_gradient"
                            android:orientation="vertical" >
    
    
    
        <ImageView
            android:id="@+id/buttonPlay"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:src="@drawable/playback_play"
            android:layout_marginLeft="6dp"
            android:layout_marginTop="4dp" />
    
            <SeekBar android:id="@+id/seekbar1"
            android:layout_width="203dp"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_weight="0.45"
            android:layout_marginTop="8dp"
            android:max="100" />
        <ImageView
            android:id="@+id/buttonstop"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:src="@drawable/playback_stop"
            android:layout_marginLeft="6dp"
            android:layout_marginTop="4dp"
            android:layout_marginRight="5dp" />
        </TableRow>  
    </LinearLayout>
    
    
                    <LinearLayout
                        android:id="@+id/content"
                        android:layout_width="match_parent"
                        android:layout_height="167dp"
                        android:orientation="vertical" >
    
                        <ImageView
                            android:id="@+id/imgCover"
                            android:layout_width="fill_parent"
                            android:layout_height="272dp"
                            android:layout_weight="0.83"
                            android:src="@drawable/test_cover"
                            android:layout_marginLeft="25dp"
                            android:layout_marginRight="25dp"
                            android:layout_marginTop="25dp" />
    
    
    
                        <TableRow
                            android:layout_width="fill_parent"
                            android:layout_height="55dp"
                            android:background="@drawable/hz_background_gradient"
                            android:orientation="vertical" >
    
                            <LinearLayout
                                android:layout_width="match_parent"
                                android:layout_height="match_parent"
                                android:orientation="vertical" >
                            <LinearLayout
                                android:layout_width="match_parent"
                                android:layout_height="30dp"
                                android:orientation="horizontal" >
    
                                <TextView
                                    android:id="@+id/textView1"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:text="Titel: "
                                    android:textAppearance="?android:attr/textAppearanceMedium" />
    
    
                                <TextView
                                    android:id="@+id/tvTitel"
                                    android:layout_width="match_parent"
                                    android:layout_height="wrap_content"
                                    android:text="Put a spell on you"
                                    android:textAppearance="?android:attr/textAppearanceMedium" />
    
                            </LinearLayout>
                                                        <LinearLayout
                                android:id="@+id/linearLayout5"
                                android:layout_width="match_parent"
                                android:layout_height="30dp"
                                android:orientation="horizontal" >
    
                                <TextView
                                    android:id="@+id/textView1"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:text="Artist: "
                                    android:textAppearance="?android:attr/textAppearanceMedium" />
                                                                <TextView
                                    android:id="@+id/tvArtist"
                                    android:layout_width="match_parent"
                                    android:layout_height="wrap_content"
                                    android:text="Credence Clearwater Revival"
                                    android:textAppearance="?android:attr/textAppearanceMedium" />
    
                            </LinearLayout>
                           </LinearLayout>
    
                        </TableRow>
    
                    </LinearLayout>
    
                </SlidingDrawer>
    

    And then, i did some really simple java code. This idea is that, you have to click on the tab to open and close the slidingDrawer. Here is the relevant java code:

    sd = (SlidingDrawer) findViewById(R.id.slidingDrawer1);
       tvToggleSD = (TextView) findViewById(R.id.tvToggleSD);
       sd.lock();
       tvToggleSD.setonclickListener(new onclickListener() {
        public void onclick(View v) {
            sd.unlock();
            if (sd.isOpened()) {
                sd.animateClose();
                tvToggleSD.setText("Visa");
            } else {
                sd.animateOpen();
                tvToggleSD.setText("Dölj");
            }
            sd.lock();
        }
       });
    

    Hope this helps someone else :)