How to move a LinearLayout to the right side of the toolbar - android

I am trying to add into the toolbar a TextView and a Spinner to implement language change from there. The problem it's that I added a LinearLayout to the toolbar but I cannot manage to move it to the right side so it won't get over the title of the activity, or to stay next to it.
Right now the LinearLayout is set like that (+ where i want it to be):
.xml code:
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay">
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/limba"
android:textColor="#color/white"
android:textSize="15sp"
android:layout_gravity="center"/>
<Spinner
android:layout_marginLeft="5dp"
android:id="#+id/spinner_limba"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.AppBarLayout>
And the result it is :
I am trying to achieve something like :
I achieved that by setting a android:paddingLeft but that wont work on all the devices the same way, so I am looking for another solution.
I have tried adding gravity but it wasn't moving my layout.

add android:layout_gravity="right" in Linear layout.
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right">
</LinearLayout>

Wrap the LinearLayout with a RelativeLayout and provide
android:layout_alignParentRight="true"
property to LinearLayout.
Try this,
<?xml version="1.0" encoding="utf-8"?>
<com.google.android.material.appbar.AppBarLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:layout_width="match_parent">
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Test"
android:textSize="15sp"
android:layout_gravity="center"/>
<Spinner
android:layout_marginLeft="5dp"
android:id="#+id/spinner_limba"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</RelativeLayout>
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.AppBarLayout>

Related

How to make bottom navigation stay at the bottom in LinearLayout?

How can I make the bottom navigation to stay at the bottom of the page by using the LinearLayout? Most solution I found is they used RelativeLayout instead of LinearLayout.
Below is my code
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:background="#color/white">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/purpleBoo"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text=" MY ACCOUNT"
android:textStyle="bold"
android:textColor="#color/white">
</TextView>
</androidx.appcompat.widget.Toolbar>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/btm_nav"
app:itemIconTint="#color/bottom_nav_color"
app:itemTextColor="#color/bottom_nav_color"
app:menu="#menu/bottom_nav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/purpleBoo"
android:clipToPadding="false" />
</LinearLayout>
It is quite easy - your xml should look like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:background="#color/white">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/purpleBoo"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text=" MY ACCOUNT"
android:textStyle="bold"
android:textColor="#color/white">
</TextView>
</androidx.appcompat.widget.Toolbar>
<!--Just add in between the action bar and bottom bar some other view with height = 0dp and weight = 1. I added one more LinearLayout-->
<LinearLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical">
</LinearLayout>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/btm_nav"
app:itemIconTint="#color/bottom_nav_color"
app:itemTextColor="#color/bottom_nav_color"
app:menu="#menu/bottom_nav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/purpleBoo"
android:clipToPadding="false" />
</LinearLayout>
In other cases it won't work. There should be at least one weight but not height based view in LinearLayout to do it.
Hope it helps.

How to correctly align buttons in an action bar with a navigation view

I created a action bar with two buttons . This activity also included with a side menu . I used a navigation view for that purpose.
So , my activity looks like below,
But actually I want it like below (notice the "Cancel" button is more closer to navigation bar, and both buttons are properly aligned),
This this is my action bar code(in layout file),
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_target_ranges"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay">
<LinearLayout
android:id="#+id/target_ranges_layout_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<android.support.v7.widget.AppCompatButton
android:id="#+id/target_ranges_cancel_btn"
style="#style/ButtonStyle_Med"
android:layout_weight="1"
android:text="#string/action_cancel" />
<android.support.v7.widget.AppCompatButton
android:id="#+id/target_ranges_save_btn"
style="#style/ButtonStyle_Med"
android:layout_weight="1"
android:text="#string/action_save" />
</LinearLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
How to achieve this ? Have any ideas ?
The problem is that your Toolbar does not set center gravity for the inner LinearLayout. You can do that by setting LayoutParams to the LinearLayout like this:
Toolbar toolbar = (Toolbar) findViewById(R.id. toolbar_target_ranges);
LinearLayout toolbarRow = (LinearLayout) toolbar.findViewById(R.id. target_ranges_layout_main);
toolbarRow.setLayoutParams(new Toolbar.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT, Gravity.CENTER));
Try this,
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_target_ranges"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
>
<LinearLayout
android:id="#+id/target_ranges_layout_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<android.support.v7.widget.AppCompatButton
android:id="#+id/target_ranges_cancel_btn"
style="#style/TextAppearance.AppCompat.Medium"
android:layout_weight="1"
android:text="Cancel"
android:layout_marginLeft="40dp"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<android.support.v7.widget.AppCompatButton
android:id="#+id/target_ranges_save_btn"
style="#style/TextAppearance.AppCompat.Medium"
android:layout_weight="1"
android:text="Add"
android:layout_marginLeft="20dp"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
</LinearLayout>
Take RelativeLayout and adjust your Button instead of LinearLayout.
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_target_ranges"
app:popupTheme="#style/AppTheme.PopupOverlay"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary">
<RelativeLayout
android:id="#+id/target_ranges_layout_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<android.support.v7.widget.AppCompatButton
android:id="#+id/target_ranges_cancel_btn"
style="#style/ButtonStyle_Med"
android:text="Cancel"
android:layout_width="wrap_content"
android:layout_marginLeft="10dp"
android:layout_alignParentLeft="true"
android:layout_height="wrap_content" />
<android.support.v7.widget.AppCompatButton
android:id="#+id/target_ranges_save_btn"
style="#style/ButtonStyle_Med"
android:layout_alignParentRight="true"
android:text="Save"
android:layout_marginRight="50dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>

TableLayout below Listview not displaying

I want to show a TableLayout below a Listview (where the the no. of items are dynamically added). I referred to a similar question before, but it didn't work for me. I am using android:layout_below to set the TableLayout below the Listview but it still doesn't work, I would appreciate anyone guiding me on how to do this.
Here is my code:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.AppBarLayout>
<ListView
android:id="#+id/list"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:clipToPadding="false"
android:divider="#color/list_divider"
android:dividerHeight="10.0sp"
android:listSelector="#drawable/list_row_selector"
android:paddingBottom="100dip"
android:paddingTop="70dip" />
<TableLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/list"
android:layout_weight="1">
<TableRow
android:id="#+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="20dp">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Total Items"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/textView11"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="idvalue_text"
android:textAppearance="?android:attr/textAppearanceLarge" />
</TableRow>
<TableRow
android:id="#+id/tableRow2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="20dp">
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Total Cost"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/textView21"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="idvalue_text"
android:textAppearance="?android:attr/textAppearanceLarge" />
</TableRow>
</TableLayout>
</android.support.design.widget.CoordinatorLayout>
Okay. So as per our discussion in the comments section on taking a look at your code, it seems you want to have both the ListView and the TableLayout to have equal height (because you included layout_weight to both of them).
So in order to produce your desired output, do the following.
Use a RelativeLayout as the Parent Layout.
Add a LinearLayout with weightSum = 2 and orientation=vertical, and put the ListView and the TableLayout inside it, where both of their height = 0dp and the layout_weight = 1.
Here's a sample snippet for your reference:
<?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:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.AppBarLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="2">
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<TableLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_below="#id/list"
android:layout_weight="1">
</TableLayout>
</LinearLayout>
</RelativeLayout>
Doing so would result to something like this:
PS: This is just the display when checking the layout in the Android Studio preview, not when the code is running.

Soft keyboard pushing toolbar into top status bar

I have gone through at least ten similar SO questions and nothing seems to work.
I have a simple relative layout with a toolbar, text views, edit text, etc (see xml below).
When edit text is focused I need the soft keyboard to push my layout up but under the toolbar (i.e. toolbar is pinned) but instead the keyboard pushes the entire layout up, toolbar included?
I have tried adjustPan, adjustResize, scrollviews, etc with no success, any help with this would be appreciated.
layout xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".activities.Test">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:id="#+id/appbar_layout"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/appbar_layout">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="match_parent">
<TextView
android:id="#+id/tv_title"
android:textSize="25dp"
android:textColor="#color/colorPrimaryDark"
android:textStyle="bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/iv"
android:layout_alignParentLeft="true" />
<TextView
android:id="#+id/tv_date"
android:textSize="15dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/iv"
android:layout_alignParentLeft="true"
android:layout_below="#+id/tv_title"/>
<ImageView
android:id="#+id/iv"
android:layout_marginRight="-6dp"
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_alignParentRight="true"
android:maxHeight="150dp"
/>
<TextView
android:id="#+id/tv_description"
android:layout_marginTop="15dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/iv"
android:layout_centerHorizontal="true"
android:textSize="15dp"
android:textColor="#color/colorPrimaryDark"/>
<RatingBar
android:id="#+id/rb"
style="?android:attr/ratingBarStyle"
android:layout_centerHorizontal="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tv_description"
android:numStars="5" />
<View
android:id="#+id/view"
android:layout_below="#+id/rb"
android:layout_width="match_parent"
android:layout_marginTop="10dp"
android:layout_height="1dp"
android:visibility="visible"
android:background="#color/colorPrimary"/>
<EditText
android:id="#+id/et"
android:layout_width="match_parent"
android:layout_height="100dp"
android:padding="#dimen/activity_horizontal_margin"
android:layout_below="#+id/view"
android:gravity="top"
android:background="#android:color/transparent"
/>
<Button
android:id="#+id/btn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#color/textColorPrimary"
android:textSize="20dp"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:layout_alignParentBottom="true"
/>
</RelativeLayout>
</ScrollView>
</RelativeLayout>
I use this code on the onCreateView of my fragment, it works fine.
getActivity().getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE);
Use CollapsingToolbarLayout
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<android.support.v7.widget.Toolbar
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent"
app:layout_collapseMode="pin"/>
</android.support.design.widget.CollapsingToolbarLayout>
and make sure you add app:layout_collapseMode="pin" flag to your Toolbar in your layout.xml.

Android Toolbar width constrained by menu items

Please help! I'm completely stuck and can't find a solution. The useable width of my Toolbar is constrained by the menu items in it. Here's a screenshot. I need to have it not constrained by the menu items so my EditText can span the width of the toolbar. Here is my layout file:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusable="true"
android:focusableInTouchMode="true"
android:orientation="vertical"
tools:context=".MainActivity"
tools:ignore="MergeRootFrame">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="250sp"
android:background="#color/primary"
android:gravity="bottom"
android:minHeight="?attr/actionBarSize">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/button_id"
android:layout_width="40sp"
android:layout_height="40sp"
android:layout_gravity="center" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/url"
android:textColor="#color/accent"
android:textSize="16sp" />
<EditText
android:id="#+id/url_text_field_id"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textNoSuggestions"
android:maxLines="1" />
<TextView
android:id="#+id/output_text_view_id"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/initial_output_text_id"
android:textSize="16sp" />
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.Toolbar>
<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
Looks like content padding. Here's an existing answered question on the subject: Android API 21 Toolbar Padding
Solution seems to be app:contentStart xml attribute on the Toolbar view. I assume contentEnd exists too.

Categories

Resources