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?
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.
It is because the fixed sizes you are using to build your layout is getting summed up eventually being too big for small screen size. You can try the following to fix this:
Create a layout specially for small screen size by using smallest width qualifier
Make your layout scrollable
Use constraint layout
Using the ssp and sdp size units
NOTE that you will have to specify the smallest width qualifier to your current layout in such a way that the smallest width qualifer excludes the small screen devices and include the devices in which your layout fits properly.
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>
Related
I have a fragment containing a recyclerView.
When an item is clicked on in the recyclerView I set the recyclerview item background to green and change the "saveBtn" text to "Update".
I need to also be able to remove the "deletebtn" every time a user clicks on a recyclerView item, or hide it so that the UI looks somewhat like this:
How could this be done?
Method I am using to update UI on recyclerView click
public void onExerciseClicked(int position) {
saveBtn.setText("Update");
clearBtn.setText("Delete");
}
XML
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/gradientfrozen"
android:id="#+id/constraint_layout21">
<LinearLayout
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#292929"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/textView5"
android:layout_width="327dp"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:paddingLeft="20dp"
android:layout_marginTop="10dp"
android:text="WEIGHT (kgs)"
android:textColor="#android:color/background_light"
android:textSize="16dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="75dp"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:orientation="horizontal">
<Button
android:id="#+id/dec_weight"
android:layout_width="1dp"
android:layout_height="50dp"
android:layout_weight="0.5"
android:background="#drawable/down22"
android:textColor="#color/design_default_color_background" />
<EditText
android:id="#+id/editTextWeight"
android:layout_width="80dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_weight="1"
android:backgroundTint="#color/green"
android:ems="10"
android:gravity="center"
android:hint="0.0"
android:inputType="numberDecimal"
android:singleLine="false"
android:textColor="#color/design_default_color_background"
android:textColorHint="#color/light_grey"
android:textSize="30sp" />
<Button
android:id="#+id/inc_weight"
android:layout_width="1dp"
android:layout_height="50dp"
android:layout_weight="0.5"
android:background="#drawable/up22" />
</LinearLayout>
<TextView
android:id="#+id/textView8"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="20dp"
android:text="REPS"
android:textColor="#android:color/background_light"
android:textSize="16dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:orientation="horizontal">
<Button
android:id="#+id/dec_reps"
android:layout_width="1dp"
android:layout_height="50dp"
android:layout_weight="1.6"
android:background="#drawable/down22"
android:shadowColor="#color/design_default_color_background" />
<EditText
android:id="#+id/editTextReps"
android:layout_width="161dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_weight="1"
android:backgroundTint="#color/green"
android:ems="10"
android:gravity="center"
android:hint="0"
android:inputType="number"
android:textColor="#color/design_default_color_background"
android:textColorHint="#color/light_grey"
android:textSize="30sp" />
<Button
android:id="#+id/inc_reps"
android:layout_width="1dp"
android:layout_height="50dp"
android:layout_weight="1.6"
android:background="#drawable/up22" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:orientation="horizontal">
<Button
android:id="#+id/save_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_weight="1"
android:background="#drawable/my_small_green_shape"
android:text="Save"
android:textColor="#ffffff"
android:textSize="20sp" />
<Button
android:id="#+id/clear_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_weight="1"
android:background="#drawable/my_small_red_shape"
android:text="Clear"
android:textColor="#ffffff"
android:textSize="20sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:orientation="horizontal">
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="Set"
android:textColor="#android:color/holo_green_light" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="Kgs"
android:textColor="#android:color/holo_green_light" />
<TextView
android:id="#+id/textView7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="Reps"
android:textColor="#android:color/holo_green_light" />
</LinearLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/completed_exercise_ListView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="25dp"
android:layout_marginRight="25dp"
android:background="#292929"
tools:listitem="#layout/completed_exercise_item" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Using LinearLayout as a direct child of ConstraintLayout defeats the whole purpose of using ConstraintLayout. It is not a good practice to use nested layout from the performance point of view. Besides, if deleteBtn is direct child of ConstraintLayout, then setting the layout_width of saveBtn to match_constraint will enable it to take up the whole space if we change the visibility of deleteBtn to gone.
cgb_pandey's answer is great and it is the recommended approach since your root viewgroup is ConstraintLayout. However, I wanted to present you an alternative way to do this using your current LinearLayout approach.
All you need to do is to set the width of both bottoms to 0dp. This way, their weight would determine how much space they occupy. If both view are visible, each of them would have 50% of the total width of the screen. If only one of the buttons is visible, it would occupy the entire screen. Here's a code snippet to guide you:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:orientation="horizontal">
<Button
android:id="#+id/save_btn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_weight="1"
android:background="#drawable/my_small_green_shape"
android:text="Save"
android:textColor="#ffffff"
android:textSize="20sp" />
<Button
android:id="#+id/clear_btn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_weight="1"
android:background="#drawable/my_small_red_shape"
android:text="Clear"
android:textColor="#ffffff"
android:textSize="20sp" />
</LinearLayout>
Not that this approach involves nesting layouts and this might affect performance in the long run and also complicate your layout code pretty fast.
i am working on a ui design assignment in android studio. i have been able to get this
here is my code
<?xml version="1.0" encoding="utf-8"?>
<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" tools:context=".MainActivity">
<ImageView
android:id="#+id/topImage"
android:src="#drawable/shebaartist"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="centerCrop" />
<TextView android:text="Event Planning and Decoration, Beads and Jewelry Making, Props and Bridals, Aso-Oke #WeMakePoshDesign"
android:drawableLeft="#drawable/about"
android:layout_below="#+id/topImage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:drawablePadding="5dp"
android:padding="10dp"
android:textSize="16dp"
android:fontFamily="sans-serif-black"
android:background="#F0E68C"
android:id="#+id/descText" />
<TextView android:text="150 Alimi Rd, Alore, Ilorin, Kwara State"
android:drawableLeft="#drawable/marker"
android:layout_below="#+id/descText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:singleLine="true"
android:drawablePadding="5dp"
android:padding="10dp"
android:textSize="16dp"
android:fontFamily="sans-serif-light"
android:id="#+id/addrText"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView android:text="shebaeventss#gmail.com"
android:drawableLeft="#drawable/message"
android:layout_below="#+id/addrText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:singleLine="true"
android:drawablePadding="5dp"
android:padding="10dp"
android:background="#F0E68C"
android:textSize="16dp"
android:fontFamily="sans-serif-black"
android:id="#+id/emailText"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView android:text="07055393673"
android:drawableLeft="#drawable/phone"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:singleLine="true"
android:drawablePadding="5dp"
android:padding="10dp"
android:textSize="16dp"
android:fontFamily="sans-serif-light"
android:id="#+id/mobilenoText"
android:layout_below="#+id/emailText"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
</RelativeLayout>
I want to align the icons and text in the text views on the same line and with the same size. my question is that how do i do this? please point out my errors and help me with fixing this.
If this is what you want, then you just need change gravity from
android:gravity="center" to android:gravity="center_vertical"
Please add gravity property to your TextView with center alignment and
icon size change with 24dp.
<TextView android:text="Event Planning and Decoration, Beads and Jewelry Making, Props and Bridals, Aso-Oke #WeMakePoshDesign"
android:drawableLeft="#drawable/about"
android:layout_below="#+id/topImage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:drawablePadding="5dp"
android:padding="10dp"
android:textSize="16dp"
android:gravity="center"
android:fontFamily="sans-serif-black"
android:background="#F0E68C"
android:id="#+id/descText" />
It seems you want to use a compound drawable, see this answer:
How do I use a compound drawable instead of a LinearLayout that contains an ImageView and a TextView
I'm working on a currency converter app. Everything is working fine. I'm using Nested Linear and Relative Layouts in my xml file. I have arranged the layouts one above the other in RelativeLayout like this. (SIMPLE IDEA)
--------------RelativeLayout----------
------FirstRow------
------Divider-------
-----secondRow------
--------------/RelativeLayout/----------
I've set the divider below firstRow and then secondRow below divider in xml. Now i want to rearrange the rows like this.
--------------RelativeLayout----------
------secondRow------
------Divider-------
-----firstRow------
--------------/RelativeLayout/----------
I'm trying to do like this divider below secondRow and firstRow below divider. but its giving me circular dependencies error. I know all about circular dependencies and i believe the java code is not reseting the above layoutparams, instead its something like merging the two layouts which will definitely shoot circular dependencies error.
XML CODE
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:id="#+id/firstRow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/namelayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:gravity="center_vertical"
android:orientation="horizontal">
<ImageView
android:id="#+id/img"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="#drawable/ic_sampleicon" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_margin="#dimen/activity_horizontal_margin"
android:orientation="vertical">
<TextView
android:id="#+id/name"
style="#style/TextLableMyTheme"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="" />
<TextView
android:id="#+id/brand"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:textColor="#f7f7f7" />
</LinearLayout>
</LinearLayout>
<TextView
android:id="#+id/tvpoints"
style="#style/TextCurrencyMyTheme"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:text="" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/divider"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/firstRow"
android:layout_marginLeft="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:orientation="horizontal">
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_centerInParent="true"
android:background="#drawable/background_gradient_light" />
<ImageView
android:id="#+id/switcherImg"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_centerInParent="true"
android:src="#drawable/ic_settings"
android:tint="#f7f7f7" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/secondRow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/divider"
android:layout_marginLeft="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:orientation="horizontal">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:gravity="center_vertical"
android:orientation="horizontal">
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:src="#drawable/ic_cash"
android:tint="#ffe100" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_margin="#dimen/activity_horizontal_margin"
android:orientation="vertical">
<TextView
android:id="#+id/name2"
style="#style/TextLableMyTheme"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Riyal" />
<TextView
android:id="#+id/brand2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:textColor="#f7f7f7" />
</LinearLayout>
</LinearLayout>
<TextView
android:id="#+id/tv"
style="#style/TextCurrencyMyTheme"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:text="0.0" />
</RelativeLayout>
</RelativeLayout>
Java Code to update params
RelativeLayout.LayoutParams _firstRowParams =
(RelativeLayout.LayoutParams)_firstRow.getLayoutParams();
_firstRowParams.addRule(RelativeLayout.BELOW, R.id.divider);
RelativeLayout.LayoutParams _dividerParams =
(RelativeLayout.LayoutParams)_divider.getLayoutParams();
_dividerParams.addRule(RelativeLayout.BELOW, R.id.secondRow);
/* _firstRow.setLayoutParams(_firstRowParams);
_divider.setLayoutParams(_dividerParams);*/
Try adding below code:
RelativeLayout.LayoutParams _secondRowParams =
(RelativeLayout.LayoutParams)_secondRow.getLayoutParams();
_secondRowParams.addRule(RelativeLayout.ALIGN_PARENT_TOP);
_secondRowParams.removeRule(RelativeLayout.BELOW);
Try with above code. It worked for me. You need to remove previous Below rule to avoid circular dependency.
As #Luksprog have mentioned about removing the existing rules before adding the new ones this code snippet will work.
RelativeLayout.LayoutParams _firstRowParams =
(RelativeLayout.LayoutParams)_firstRow.getLayoutParams();
_firstRowParams.removeRule(EXISIING_RULE)//RelativeLayout.Below or RelativeLayout.Above or any other
_firstRowParams.addRule(RelativeLayout.BELOW, R.id.divider);
RelativeLayout.LayoutParams _dividerParams =
(RelativeLayout.LayoutParams)_divider.getLayoutParams();
_dividerRowParams.removeRule(EXISIING_RULE)//RelativeLayout.Below or RelativeLayout.Above or any other
_dividerParams.addRule(RelativeLayout.BELOW, R.id.secondRow);
I'm trying to resize the images and increase the icon size however I have added them to a LinearLayout and each 5 icons share the weight. They fit by themselves thus making it impossible for me to increase their icon size/height/width.
A Snapshot:
Here's my XML:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffffff"
android:orientation="horizontal"
android:weightSum="5">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="60dp"
android:layout_weight="1"
android:background="#null"
android:src="#drawable/feed_blue" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="60dp"
android:layout_weight="1"
android:background="#null"
android:src="#drawable/compass" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="60dp"
android:layout_weight="1"
android:background="#null"
android:src="#drawable/circle_blue" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="60dp"
android:layout_weight="1"
android:background="#null"
android:src="#drawable/heart_beat" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="60dp"
android:layout_weight="1"
android:background="#null"
android:src="#drawable/user_icon_female" />
</LinearLayout>
I need to increase/decrease the size of my icons as I wish but the Weight property is probably limiting that ability. How can I get that done folks?
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:orientation="horizontal"
android:weightSum="5">
<ImageButton
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#null"
android:src="#drawable/feed_blue" />
<ImageButton
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#null"
android:src="#drawable/compass" />
<ImageButton
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#null"
android:src="#drawable/circle_blue" />
<ImageButton
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#null"
android:src="#drawable/heart_beat" />
<ImageButton
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#null"
android:src="#drawable/user_icon_female" />
</LinearLayout>
In this situation they all have %20 percent of total width you can change width easily by changing weight. And also you can change width and height using padding property.
For normal app you need images pack for all android resources like mipmap-hdpi, mipmap-mdpi, mipmap-nodpi, mipmap-xhdpi, mipmap-xxhdpi, mipmap-xxxhdpi and you should not change image size programmatically, if you have not image pack try to play vs android:scaleType in all buttons for example android:scaleType="centerCrop"
In android studio when I see my app in the design view in XML it looks fine to me (just how I want it). But when I run my app on my device which is a Moto G the layout seems to just flop to one side. Why is this?
My Moto G device below (all the views and features flops to the side)
The design view in android studio. Everything looks good.
My XML code below
<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"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:background="#drawable/backgroundpage"
tools:context="xetron.appathon.orbis.landmarks">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="70dp"
android:background="#drawable/bar"
android:id="#+id/relativeLayout">
<TextView
android:text="Landmarks"
android:textStyle="bold"
android:textSize="30sp"
android:textColor="#005491"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginLeft="62dp"
android:layout_marginTop="11dp"
android:id="#+id/textView" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/landmarkName"
android:textStyle="bold"
android:textSize="30sp"
android:textColor="#005491"
android:text="UK"
android:layout_toEndOf="#+id/textView"
android:layout_marginLeft="34dp"
android:layout_alignTop="#+id/textView"
android:layout_toRightOf="#+id/textView" />
</RelativeLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/lmkname1"
android:textStyle="bold"
android:textSize="20sp"
android:textColor="#8FCE7B"
android:text="Forbidden
Kingdom"
android:layout_marginLeft="35dp"
android:layout_marginTop="80dp"
/>
<ImageView
android:layout_width="180dp"
android:layout_height="160dp"
android:src="#drawable/lmk1china"
android:layout_below="#+id/relativeLayout"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginTop="57dp"
android:id="#+id/lmkimg1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/lmkname2"
android:textStyle="bold"
android:textSize="25sp"
android:textColor="#8FCE7B"
android:text="Shanghai
Tower"
android:layout_marginLeft="210dp"
android:layout_marginTop="80dp"
/>
<ImageView
android:layout_width="180dp"
android:layout_height="160dp"
android:src="#drawable/lmk2china"
android:layout_alignTop="#+id/lmkimg1"
android:layout_alignRight="#+id/relativeLayout"
android:layout_alignEnd="#+id/relativeLayout"
android:id="#+id/lmkimg2" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/lmkname3"
android:textStyle="bold"
android:textSize="25sp"
android:textColor="#8FCE7B"
android:text="Great Wall
Of China"
android:layout_marginLeft="35dp"
android:layout_marginTop="435dp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/lmkname4"
android:textStyle="bold"
android:textSize="25sp"
android:textColor="#8FCE7B"
android:text="Temple Of
Heaven"
android:layout_marginLeft="210dp"
android:layout_marginTop="435dp"
/>
<ImageView
android:layout_width="180dp"
android:layout_height="160dp"
android:src="#drawable/lmk3china"
android:layout_below="#+id/lmkimg1"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:id="#+id/lmkimg3" />
<ImageView
android:layout_width="180dp"
android:layout_height="160dp"
android:src="#drawable/lmk4china"
android:layout_below="#+id/lmkimg2"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_marginBottom="24dp"
android:id="#+id/lmkimg4"/>
</RelativeLayout>
You should try to create a design with less fixed sizes (e.g. image-size 180dp), because this will never scale well on all screen-sizes. I find it never easy to build a well-scaling layout and you have to test it right away while building.
That said, you can create different layouts, for different screen sizes by appending the size to the xml-filename. This is, however, mainly used to define different layouts for the major screen-sizes: phone, tablet, landscape, portrait. It is not used to define a separate layout for difference in inches.
You must avoid to use "hard" values in dimensions. Use "dip" instead. Also, use weights for elements positioning.
Example:
<LinearLayout
android:id="#+id/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<View
android:layout_width="0dip"
android:layout_height="match_parent"
android:background="#FF0000"
android:layout_weight="1" />
</LinearLayout>