Android 6.0. I want to has translucent status bar.
my_layout.xml:
<ScrollView
android:id="#+id/srollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:fitsSystemWindows="true">
<LinearLayout
android:id="#+id/content_layer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:id="#+id/containerPhoneNumber"
android:layout_width="match_parent"
android:layout_height="64dp">
<EditText
style="#style/edit_text_style"
android:layout_width="match_parent"
android:layout_height="64dp"
/>
...
</ScrollView>
styles.xml
<style name="RegistrationTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:windowTranslucentStatus">true</item>
</style>
As result the status bar is translucent. OK.
When start my_layout.xml on Android 7.0 , and focus on editText the scroll success scrolling. OK. But when I run same my_layout.xml on Android 5.0/6.0 the scrolling is NOT work. Why?
Thanks.
The solution is to create parent container (LinearLayout with attirbute "fitsSystemWindows" = true) for ScrollView.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:orientation="vertical">
<ScrollView
android:id="#+id/srollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:fitsSystemWindows="true">
<LinearLayout
android:id="#+id/content_layer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:id="#+id/containerPhoneNumber"
android:layout_width="match_parent"
android:layout_height="64dp">
<EditText
style="#style/edit_text_style"
android:layout_width="match_parent"
android:layout_height="64dp"
/>
...
</ScrollView>
</LinearLayout>
Thanks.
Related
I'm following this solution to create transparent status bar
The problem is now i have a ScrollView which is not working if i opened the keyboard.
If i remove this line it works fine but i loose the transparent status bar feature.
w.setFlags(WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS, WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS);
Any idea why this is happening and how to solve it ?
This my layout xml
<?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="wrap_content"
android:orientation="vertical"
android:fitsSystemWindows="true"
tools:context="com.paytabs.merchant.paytabsmerchant.Activities.RegisterOneActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:title="Create Your Account"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/r1toolbar"
android:layout_width="match_parent"
android:paddingTop="10dp"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
/>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_register_one" />
</LinearLayout>
And this is what is inside content_register (Minimal Code, my controls inside this linear layout)
<ScrollView
android:fillViewport="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="vertical"
android:isScrollContainer="false"
xmlns:android="http://schemas.android.com/apk/res/android">
<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:orientation="vertical"
android:paddingBottom="50dp"
android:paddingTop="10dp"
android:paddingRight="20dp"
android:paddingLeft="20dp"
tools:context="com.paytabs.merchant.paytabsmerchant.Activities.RegisterOneActivity"
tools:showIn="#layout/activity_register_one">
</LinearLayout>
</ScrollView>
I'm trying to achieve the following view in a chat app. There are basically two states one with the soft touch keyboard showing and one without.
So this is my initial state without the keyboard showing.
This is what happens when the keyboard shows up.
This is what i'm trying to achieve.
Note
I'm current using "adjust-resize" as the windowSoftInputMode. I know using "adjust-pan" will fix the issue, but with "adjust-pan" there are 2 problems :
The toolbar also moves up making space for the edit-text and keyboard.
The editText gets partly covered by the keyboard.
A layout experts help is needed here!
Thanks in advance.
Edit:
This is what my XML looks like:
<RelativeLayout
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">
<LinearLayout
android:id="#+id/view_group_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimaryDark"
android:elevation="4dip" >
<!-- Toolbar stuff -->
</android.support.v7.widget.Toolbar>
</LinearLayout>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bottom_bar"
android:layout_below="#+id/view_group_toolbar"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.6">
<include
layout="#layout/layout_that_covers_60%_of_the_screen (This is not my actual layout name :/ using it for understandability)"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<LinearLayout
android:id="#+id/view_group_recycler_view"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.4"
android:gravity="center_vertical">
<include
layout="#layout/layout_that_covers_40%_of_the_screen"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
</LinearLayout>
<RelativeLayout
android:id="#+id/bottom_bar"
android:layout_width="match_parent"
android:layout_height="60dip"
android:layout_alignParentBottom="true"
android:gravity="bottom"
android:padding="8dip" >
<!-- This is where my edit text resides -->
</RelativeLayout>
</RelativeLayout>
So here is what I think you should do,
use
windowSoftInputMode="adjustResize" - The activity's main window is always resized to make room for the soft keyboard on screen. Also adjustResize keeps the ToolBar on top.
Try adding both your LinearLayouts inside a NestedScrollView. The reason I say this is because your NestedScrollView contents can scroll up.
I think your Layout will look like this- .
<RelativeLayout
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">
<LinearLayout
android:id="#+id/view_group_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimaryDark"
android:elevation="4dip" >
<!-- Toolbar stuff -->
</android.support.v7.widget.Toolbar>
</LinearLayout>
<NestedScrollView
android:layout_above="#+id/bottom_bar"
android:layout_below="#+id/view_group_toolbar">
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.6">
<include
layout="#layout/layout_that_covers_60%_of_the_screen (This is not my actual layout name :/ using it for understandability)"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<LinearLayout
android:id="#+id/view_group_recycler_view"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.4"
android:gravity="center_vertical">
<include
layout="#layout/layout_that_covers_40%_of_the_screen"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
</LinearLayout>
</NestedScrollView>
<RelativeLayout
android:id="#+id/bottom_bar"
android:layout_width="match_parent"
android:layout_height="60dip"
android:layout_alignParentBottom="true"
android:gravity="bottom"
android:padding="8dip" >
<!-- This is where my edit text resides -->
</RelativeLayout>
Let me know if this works for you.
EDIT 1:
If you have a RecyclerView inside your layouts, you may need to set this attribute for smooth scroll -
recyclerView.setNestedScrollingEnabled(false);
I need translucent status bar. So I use flag in styles.xml.
<item name="android:windowTranslucentStatus">true</item>
my_layout.xml
<?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="match_parent"
android:orientation="vertical">
<include layout="#layout/tool_bar" />
<LinearLayout
android:id="#+id/containerCenter"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:orientation="vertical">
<ListView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:animateLayoutChanges="true"
android:background="#ffffff"
android:scrollbarStyle="outsideOverlay" />
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:text="Test"/>
<EditText
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
</LinearLayout>
When I click on EditText the soft keyboard overlap the editText. So I use flag "android:fitsSystemWindows=true "to fix this. OK.
But as result above on listView (between "tool_bar" and "containerCenter) has gap with height equal to height of status bar.
How I can remove this gap?
Here is attach:
If I move the android:fitsSystemWindows="true" to the top-most LinearLayout
the gap is gone BUT statusbar not translucent anymore. See attachment#2
Today I was thinking of a way to improve my tablet design, and I found this image
I wanted that so bad, as it looks amazing. I am searching google for about a hour now and I haven't come across any good tutorials. I've found this one: v21 Material Design for Pre Lollipop.
I started implementing this right away and everything I tried went completely wrong. The theming for the standalone actionbar needs to be the ThemeOverlay.AppCompat.ActionBar however on my phone layout I am extending the Theme.AppCompat.NoActionBar theme. (Theme is below)
It's just not clear what I should do to make something like the image above on Tablets and show the normal (custom) supportActionBar on Phones without messing up one of them.
Here is my AppTheme style (that I apply to my app)
<!-- Base application theme. -->
<style name="AppTheme" parent="#style/Theme.AppCompat.NoActionBar">
<!-- your app branding color for the app bar -->
<item name="colorPrimary">#color/primaryColor</item>
<!-- darker variant for the status bar and contextual app bars -->
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<!-- theme UI controls like checkboxes and text fields -->
<item name="colorAccent">#color/colorAccent</item>
</style>
Before you ask, yes I've found this quesion on SO, but no this isn't a duplicate question. The post that Chris Banes wrote didn't make things clear for me as well.
Is it possible to do this without destroying both the layouts? Thinking out loud, the reason for me to pick the custom toolbar was because I had included a custom searchview, but removed it. There is another view in the toolbar but I think that it could be removed if it's really necessary.
This is the layout of my phone version.
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/coordinatorLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:theme="#style/Theme.AppCompat.NoActionBar">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:animateLayoutChanges="true"
android:orientation="vertical">
<include android:id="#+id/toolbar" layout="#layout/toolbar"
app:layout_scrollFlags="scroll|enterAlways" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
android:background="#color/primaryColor"
android:minHeight="?attr/actionBarSize"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawerLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/appBarLayout"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity" />
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:id="#+id/replaceFrameLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/errorWarnings"
android:visibility="gone"
android:gravity="center"
android:layout_gravity="center">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/errorIcon"
android:tint="#color/fab_material_red_500"
android:layout_centerVertical="true"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/errorDescription"
android:layout_below="#+id/errorIcon"/>
</RelativeLayout>
<com.tim.koers.wallpapers.UI.FilterButton
android:id="#+id/filterButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right|bottom"
android:layout_margin="16dp"
android:clickable="true"
android:src="#drawable/ic_menu_filter"
android:elevation="6dp"
android:tint="#color/fab_material_white"
android:visibility="gone"/>
</FrameLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:menu="#menu/drawer"/>
</android.support.v4.widget.DrawerLayout>
</android.support.design.widget.CoordinatorLayout>
Here is my tablet layout:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/coordinatorLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawerLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:animateLayoutChanges="true"
android:orientation="vertical"
android:background="#android:color/white"
android:layout_marginEnd="64dp"
android:layout_marginStart="64dp"
android:layout_marginTop="56dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- This is the secondary toolbar, 72dp also according to specs -->
<include android:id="#+id/toolbar" layout="#layout/toolbar"
app:layout_scrollFlags="scroll|enterAlways" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
android:background="#color/primaryColor"
android:minHeight="?attr/actionBarSize"/>
</RelativeLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="56dp"
android:layout_marginEnd="64dp"
android:layout_marginStart="64dp"
tools:context=".MainActivity" />
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:id="#+id/replaceFrameLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/errorWarnings"
android:visibility="gone"
android:gravity="center"
android:layout_gravity="center">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/errorIcon"
android:tint="#color/fab_material_red_500"
android:layout_centerVertical="true"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/errorDescription"
android:layout_below="#+id/errorIcon"/>
</RelativeLayout>
<com.tim.koers.wallpapers.UI.FilterButton
android:id="#+id/filterButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right|bottom"
android:layout_margin="16dp"
android:clickable="true"
android:src="#drawable/ic_menu_filter"
android:elevation="6dp"
android:tint="#color/fab_material_white"
android:visibility="gone"/>
</FrameLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:menu="#menu/drawer"/>
</android.support.v4.widget.DrawerLayout>
</FrameLayout>
</android.support.design.widget.CoordinatorLayout>
I found an article that implements this layout.
Create a Card Toolbar (Nested Toolbar) in Android
You can implement it to your tablet layout.
It is composed of a extended-height toolbar (blue) and a CardView with title and regular menu.
The basic structure:
<FrameLayout>
<!-- Extended Toolbar holding Drawer icon -->
<android.support.v7.widget.Toolbar />
<android.support.v7.widget.CardView>
<LinearLayout>
<!-- Card Toolbar -->
<android.support.v7.widget.Toolbar />
<!-- Divider -->
<View />
</LinearLayout>
</android.support.v7.widget.CardView>
</FrameLayout>
step1 double the height of the toolbar
step2 setting up the CardView as the secondary toolbar
step3 Java code
origin toolbar: set Navigation Icon
CardView toolbar: set menu and title
See More
Android 5.0 - How to implement this tablet layout from Material Design guidelines
Googling this Picture
After many hours of trying things out I've come up with the following code:
For your phone layout use this as a base:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/coordinatorLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:theme="#style/Theme.AppCompat.NoActionBar">
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawerLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:animateLayoutChanges="true"
android:orientation="vertical">
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="#color/primaryColor"
android:minHeight="?attr/actionBarSize"
style="#style/tabsWidgetIndicatorColors"
android:theme="#style/Theme.AppCompat.NoActionBar">
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
android:background="#color/primaryColor"
android:minHeight="?attr/actionBarSize"/>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- Put your content here -->
</FrameLayout>
</RelativeLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:menu="#menu/drawer"/>
</android.support.v4.widget.DrawerLayout>
</android.support.design.widget.CoordinatorLayout>
For your tablet layout use this as a base:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/coordinatorLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:theme="#style/Theme.AppCompat"
>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawerLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:fitsSystemWindows="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="128dp"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/primaryColor"
android:minHeight="?attr/actionBarSize"
android:id="#+id/actionToolbar"
/>
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/primaryColor"
android:minHeight="?attr/actionBarSize"
/>
</LinearLayout>
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:animateLayoutChanges="true"
android:orientation="vertical"
android:layout_marginEnd="64dp"
android:layout_marginStart="64dp"
android:layout_marginTop="56dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- This is the secondary toolbar, 72dp also according to specs -->
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="#color/colorSecondary"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar"
android:minHeight="72dp"
style="#style/tabsWidgetIndicatorColors"
>
<!--android:background="?attr/colorPrimary"-->
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
android:background="#color/colorSecondary"
android:minHeight="?attr/actionBarSize"/>
<!--android:background="?attr/colorPrimary"-->
</RelativeLayout>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- your content here-->
</FrameLayout>
</RelativeLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:menu="#menu/drawer"/>
</android.support.v4.widget.DrawerLayout>
</FrameLayout>
</android.support.design.widget.CoordinatorLayout>
In your main code use findViewById to find the Toolbar with the id #+id/toolbar and #+id/actionBar.
If you are on a tablet layout, both Toolbars should not be null. On a phone, the actionBar is null.
Check for that, and if it's not null, you will need to set the supportactionbar to the toolbar with the id #+id/actionBar, and you will need to inflate the menu on the toolbar with the id #+id/toolbar. While running the tablet/phone check, make a new private boolean accessible to your class named isInflateMenuEnabled. If the #+id/actionBar toolbar is not null, isInflateMenuEnabled should be false.
To wrap things up, this is the code:
public class MainActivity extends AppCompatActivity implements Toolbar.OnMenuItemClickListener{
private boolean isInflateMenuEnabled = true;
private Toolbar mToolbar;
#Override
protected void onCreate(Bundle savedInstanceState) {
setContentView(R.layout.activity_main);
//Check if it is a tablet or phone
mToolbar = (Toolbar) findViewById(R.id.toolbar);
Toolbar actionToolbar = (Toolbar)findViewById(R.id.actionToolbar);
if(actionToolbar != null){
isInflateMenuEnabled= false;
setSupportActionBar(actionToolbar);
actionToolbar.setTitle("");
mToolbar.inflateMenu(R.menu.menu_main);
mToolbar.setOnMenuItemClickListener(this);
}else{
mToolbar.inflateMenu(R.menu.menu_main); // Inflate the menu because there will be no menu inflated automatically anymore.
mToolbar.setOnMenuItemClickListener(this);
setSupportActionBar(mToolbar);
}
mToolbar.setTitle(getString(R.string.title));
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.menu_main, menu);
return isInflateMenuEnabled;
}
#Override
public boolean onOptionsItemSelected(final MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
// This will be working with your menu clicks
}
}
How do I set this action bar in a way even when scroll the long data screen it keeps visible on the top of the screen?
toolbar.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
Guys please see my update:
I tried everything but it seems that next component after actionBar is not being set after actionBar but behind it:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:background="#drawable/background_telas"
android:orientation="vertical" >
<include layout="#layout/toolbar" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ScrollView
android:id="#+id/scrollView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:fillViewport="true" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
</ScrollView>
</LinearLayout>
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/actionBar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#color/actionBarBackgroundColor"
app:contentInsetEnd="0dp"
app:contentInsetStart="0dp" >
</android.support.v7.widget.Toolbar>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#A0A09F" />
Project (eclipse):
Screen stopped:
Screen scrolled up:
Java:
Toolbar actionBar = (Toolbar) findViewById(R.id.actionBar);
actionBar.setTitle("ProTaxi Passageiro");
actionBar.setSubtitle("Cadastro");
actionBar.setTitleTextColor(Color.parseColor("#846A1A"));
setSupportActionBar(actionBar);
If you don't want the Toolbar to scroll with the content, then you have to put it outside the ScrollView.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include layout="#layout/toolbar" />
<ScollView
...>
you content here..
</ScollView>
</LinearLayout>
You can also set the layout_scrollFlags to enterAlways to get rid of the toolbar scrolling.
<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="enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay">
</android.support.v7.widget.Toolbar>
I had a similar problem with the layout behind the toolbar, setting fixed height to the Toolbar helped me, try android:layout_height="?attr/actionBarSize". Also use the layout #Floern adviced you.
To fix the layout above the bar, try doing the following. Wrap the whole activity in a relative layout. Then give an id to the Top Action Bar Relative layout. Afterwards on your scroll view, add this line layout_below/#id/top_profile_bar to have the layout scroll below the bar.
<RelativeLayout 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">
<!--Top Action Bar-->
<RelativeLayout
android:id="#+id/topprofilebar"
android:layout_width="match_parent"
android:layout_height="50dp">
<include layout="#layout/top_actions_bar" />
</RelativeLayout>
<!--Add a layout_below/#id/top_profile_bar to have it below the bar-->
<ScrollView
android:layout_below="#id/topprofilebar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!--Some Content-->
</ScrollView>
then in your top_actions_bar.xml add app:layout_scrollFlags="enterAlways" to the tool bar.
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:id="#+id/profileToolBar"
app:layout_scrollFlags="enterAlways"
android:background="#drawable/bg_white_grey_border_bottom">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/ivBack"
android:layout_width="wrap_content"
android:layout_height="match_parent"/>
<TextView
android:layout_toRightOf="#+id/ivBack"
android:id="#+id/top_actions_bar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:textSize="20sp"
android:textColor="#color/colorBlack"
android:layout_marginLeft="15dp"
android:text="Scoper Settings"
/>
</RelativeLayout>
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.AppBarLayout>
Hope this helps!