Menu
I have a layout file in my Android application:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:background="@color/player_background"
android:gravity="center_horizontal"
android:orientation="vertical"
tools:context=".Fragments.PlayerFragment">
<ProgressBar
android:id="@+id/progress_bar_player"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="5dp"
android:theme="@style/ProgressBarStyle"
android:visibility="invisible" />
<TextView
android:id="@+id/title_label"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:gravity="center"
android:text="Title"
android:textColor="@color/white"
android:textSize="24dp" />
<ImageView
android:id="@+id/view_imageview"
android:layout_width="280dp"
android:layout_height="280dp"
android:layout_marginTop="10dp"
android:background="@color/white" />
<TextView
android:id="@+id/status_label"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:gravity="center"
android:text="Status"
android:textColor="@color/white"
android:textSize="20dp" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp">
<ImageButton
android:id="@+id/play_pause_btn"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_centerHorizontal="true"
android:background="@drawable/round_button"
android:gravity="center_vertical|center_horizontal"
android:padding="20dp"
android:scaleType="fitCenter"
android:src="@drawable/play_btn" />
<ImageButton
android:id="@+id/sleep_timer_btn"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_marginLeft="30dp"
android:layout_toRightOf="@+id/play_pause_btn"
android:background="@drawable/round_button"
android:gravity="center_vertical|center_horizontal"
android:padding="20dp"
android:scaleType="fitCenter"
android:src="@drawable/sleep_btn" />
<ImageButton
android:id="@+id/share_btn"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_marginRight="30dp"
android:layout_toLeftOf="@+id/play_pause_btn"
android:background="@drawable/round_button"
android:gravity="center_vertical|center_horizontal"
android:padding="20dp"
android:scaleType="fitCenter"
android:src="@drawable/share_btn" />
<TextView
android:id="@+id/sleep_timer_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/sleep_timer_btn"
android:layout_alignLeft="@+id/sleep_timer_btn"
android:layout_alignRight="@+id/sleep_timer_btn"
android:layout_marginTop="5dp"
android:gravity="center"
android:text="Status"
android:textColor="@color/white"
android:textSize="15dp" />
</RelativeLayout>
<SeekBar
android:id="@+id/volume_seek_bar"
android:layout_width="match_parent"
android:layout_height="40dp"
android:theme="@style/Volume_Seekbar"
android:paddingStart="30dp"
android:paddingEnd="30dp"/>
</LinearLayout>
It's working perfectly in most of the devices but in a small screen device I can't see the SeekBar because it's out from the screen. Any idea how I can fix it?
956
Android Layout TypesLinearLayout : is a ViewGroup that aligns all children in a single direction, vertically or horizontally. RelativeLayout : is a ViewGroup that displays child views in relative positions. AbsoluteLayout : allows us to specify the exact location of the child views and widgets.
When the orientation of a LinearLayout is unspecified, it is using the default, which is horizontal . Should the layout be a column or a row? Use "horizontal" for a row, "vertical" for a column. The default is horizontal.
LinearLayout is a view group that aligns all children in a single direction, vertically or horizontally. You can specify the layout direction with the android:orientation attribute. Note: For better performance and tooling support, you should instead build your layout with ConstraintLayout.
Just add layout_weight="1" to in your linearLayout which having Buttons. adding anroid:layout_weight="1" does not move the linear layout (and buttons) down to the bottom...
You are using very large fixed sizes on your views, and because different phones got different screen sizes what seems to work on some device will actually not work on another
For example - in a smaller device with height of 300dp with views summing up to total of 400dp you will not have enough room for some views because of the small screen size and that's why you are not seeing your view.
You can use ConstraintLayout to make your screen responsive, or if you want to keep your current layout structure you can use the following libraries for scaling size of dp:
ssp and sdp to get a scalable size unit for your views and texts.
Another option is to wrap your layout with ScrollView, giving your screen the option to be scrollable and by that you will be able to "see" all of your views on your screen - note that this may not be intuitive to your user.
56
I would suggest you to use constraint layout, but if you still want to go ahead with your current view then it will be good practice if you add scrollview to your parent layout, so that your layout won't get cropped on smaller devices:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
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"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/player_background"
android:gravity="center_horizontal"
android:orientation="vertical"
tools:context=".Fragments.PlayerFragment">
<ProgressBar
android:id="@+id/progress_bar_player"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="5dp"
android:theme="@style/ProgressBarStyle"
android:visibility="invisible" />
<TextView
android:id="@+id/title_label"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:gravity="center"
android:text="Title"
android:textColor="@color/white"
android:textSize="24dp" />
<ImageView
android:id="@+id/view_imageview"
android:layout_width="280dp"
android:layout_height="280dp"
android:layout_marginTop="10dp"
android:background="@color/white" />
<TextView
android:id="@+id/status_label"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:gravity="center"
android:text="Status"
android:textColor="@color/white"
android:textSize="20dp" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp">
<ImageButton
android:id="@+id/play_pause_btn"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_centerHorizontal="true"
android:background="@drawable/round_button"
android:gravity="center_vertical|center_horizontal"
android:padding="20dp"
android:scaleType="fitCenter"
android:src="@drawable/play_btn" />
<ImageButton
android:id="@+id/sleep_timer_btn"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_marginLeft="30dp"
android:layout_toRightOf="@+id/play_pause_btn"
android:background="@drawable/round_button"
android:gravity="center_vertical|center_horizontal"
android:padding="20dp"
android:scaleType="fitCenter"
android:src="@drawable/sleep_btn" />
<ImageButton
android:id="@+id/share_btn"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_marginRight="30dp"
android:layout_toLeftOf="@+id/play_pause_btn"
android:background="@drawable/round_button"
android:gravity="center_vertical|center_horizontal"
android:padding="20dp"
android:scaleType="fitCenter"
android:src="@drawable/share_btn" />
<TextView
android:id="@+id/sleep_timer_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/sleep_timer_btn"
android:layout_alignLeft="@+id/sleep_timer_btn"
android:layout_alignRight="@+id/sleep_timer_btn"
android:layout_marginTop="5dp"
android:gravity="center"
android:text="Status"
android:textColor="@color/white"
android:textSize="15dp" />
</RelativeLayout>
<SeekBar
android:id="@+id/volume_seek_bar"
android:layout_width="match_parent"
android:layout_height="40dp"
android:paddingStart="30dp"
android:paddingEnd="30dp"
android:theme="@style/Volume_Seekbar" />
</LinearLayout>
</ScrollView>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
