I'm using Support Android Percentage Library's RelativeLayout AKA android.support.percent.PercentRelativeLayout but it has extra margin on the left edge same as RelaytiveLayout I didn't set any margin or padding but it's still has it, Search a lot and done anything which worked for other people... but NOT SOLVED!
Activity Main Layout codes :
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/mainCoordinatorLayout"
android:layout_height="match_parent"
android:layout_width="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/mainAppbarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/mainToolbar1"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary">
<TextView
android:id="#+id/mainTitle"
android:text="#string/app_name"
android:textColor="#android:color/white"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</android.support.v7.widget.Toolbar>
<android.support.v7.widget.Toolbar
android:id="#+id/mainFlexibleSpace"
android:layout_width="match_parent"
android:layout_height="180dp">
<android.support.percent.PercentRelativeLayout
android:id="#+id/mainPercentRelativeLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/mainEnterLink"
android:text="#string/str_mainMessageText"
android:gravity="center"
android:textColor="#android:color/white"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.percent.PercentRelativeLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
Any Help? See This Image of my rendered Layout Code
Check if it's a issue with the toolbar too (mainFlexibleSpace). If yes then,
Declare the toolBar in java and do this.
toolBar.setContentInsetsAbsolute(0,0);
Related
i am very new to android i am trying to display one background image to all my tool and tabs and fragment ,i got this background image to my toolbar and tab but how to show same background image to my fragment please any one help me how to do this
my Xml code
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:id="#+id/mainActivityBar"
android:layout_alignParentTop="true"
android:background="#drawable/actionbar"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:contentInsetEnd="0dp"
app:contentInsetRight="0dp"
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="President"
android:id="#+id/appname_1"
android:background="#android:color/transparent"
android:textColor="#ffffff"
android:layout_marginLeft="20dp" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
style="#style/myCustomTabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:layout_below="#+id/appname_1"
android:layout_alignParentEnd="true"
android:layout_alignParentStart="false"
android:layout_alignParentLeft="false"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="false"
android:layout_alignLeft="#+id/appname_1"
app:tabGravity="fill"
app:tabMode="scrollable"/>
</RelativeLayout>
I want like below image please any one help me how to get like below image
Try to do the following:
Set the background of your TabLayout and Toolbar to transparent.
you can do that by this attribute: android:background="#android:color/transparent"
Then set the desired background image to your root view. (In your case its most probably a CoordinatorLayout - you didn't post the full layout).
If you need a code example let me know, but it should be pretty straightforward.
EDIT:
As you requested a code example. It's just as I described above.
Instead of CoordinatorLayout as the root layout you can use of course any other layout you need.
<?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:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/background">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/transparent"
app:popupTheme="#style/AppTheme.PopupOverlay" />
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"/>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
This is the activity_main.xml layout for Androids default tab application:
<?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/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".activities.MainActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/appbar_padding_top"
android:theme="#style/AppTheme.AppBarOverlay">
<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/AppTheme.PopupOverlay">
</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.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
<!-- When I add my own view here and use match_parent, it fills ENTIRE screen, even over the Toolbar. The ViewPager right above does not do this. Why? -->
</android.support.design.widget.CoordinatorLayout>
I am trying to add my own buttons/textviews/etc to my activity_main.xml but I do not know where to add them. The android.support.v4.view.ViewPager uses match_parent although it does not fit the whole screen, it expands across the entire screen besides the Toolbar area at the top. However, whenever I add my own view underneath the android.support.v4.view.ViewPager, lets say RelativeView and set it to match_parent, it expands OVER the Toolbar. This led me to believe that I should put my contents inside the ViewPager tags but that does not work either.
Where should I put my views so that they are not overlapping the Toolbar?
You can wrap your ViewPager in an RelativeLayout and you can add the view child also.
Here is the code snippet which may help you-
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorAccent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<Button
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="48dp"
android:text="I am clickable" />
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentEnd="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentStart="true"
android:layout_below="#+id/button"
android:background="#color/colorNeutral"
android:layout_above="#+id/button2" />
<Button
android:layout_marginBottom="56dp"
android:layout_alignParentBottom="true"
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="48dp"
android:text="I am clickable too" />
</RelativeLayout>
my Layout looks like below
You can see spinner added to my toolbar, but what I want is to make it right align, show it to most right of toolbar.
below is the xml code I used
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical" >
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_height="0dp"
android:layout_width="match_parent"
android:layout_weight="1"
android:elevation="4dp"
android:gravity="right" //gravity set to right
android:background = "#color/color_toolbar"
>
<Spinner
android:id="#+id/spinner_category"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</android.support.v7.widget.Toolbar>
</LinearLayout>
spinner is not showing android:layout_gravity
I tried setting gravity to right but it doesn't work. how can I do this?
I had the same issue. I have fixed the alignment issue based on the comments of question. So keeping the answer here to help someone directly.
<?xml version="1.0" encoding="utf-8"?>
<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/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary">
<Spinner
android:id="#+id/toolbar_spinner"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:visibility="visible"
android:layout_gravity="right"/>
</android.support.v7.widget.Toolbar>
The question is simple: How to set (any) layout bellow navigation bar in a coordinatorLayout?
If I use a frameLayout in a RelativeLayout, the RelativeLayout height fill the whole screen include the navigationBar.
Here is my code:
<RelativeLayout
android:id="#+id/drawer_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="false"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<FrameLayout
android:id="#+id/frameLayout"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
<android.support.design.widget.AppBarLayout
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="?android:attr/actionBarSize"
android:background="#color/primary"
app:layout_scrollFlags="scroll|enterAlways"
android:minHeight="?android:attr/actionBarSize"
app:popupTheme="#style/MaterialDrawerTheme.Light.DarkToolbar"
app:theme="#style/ToolbarTheme">
<TextView
android:id="#+id/toolbar_title"
style="#style/TextAppearance.AppCompat.Widget.ActionBar.Title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:gravity="center"
android:textColor="#color/icons" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
And the problem (after I added a fragment the frameLayout):
image 1
And the Android Studio preview screen:
image 2
(Sorry for the images, currently i haven't got enough repulation to post directly here :( )
Change android:fitsSystemWindows to false:
android:fitsSystemWindows="false"
I'm using android library Android-ObservableScrollView from ksoichiro. I use his sample Flexible Space with viewpager and i modify it.
But there's some problem. You can see in my xml there is 2 android:fitsSystemWindows. One in LinearLayout, and the other in Toolbar. In LinearLayout working good. but in Toolbar is not working. Why this happen?
Thank you. Sorry for my bad english
theres my xml code:
<FrameLayout 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">
<com.github.ksoichiro.android.observablescrollview.TouchInterceptionFrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="#dimen/flexible_background"
android:scaleType="centerCrop"
android:src="#drawable/bridge" />
<View
android:id="#+id/overlay"
android:layout_width="match_parent"
android:layout_height="#dimen/flexible_background"
android:background="?attr/colorPrimary" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:fitsSystemWindows="true">
<FrameLayout
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="#dimen/flexible_height">
<TextView
android:id="#+id/title"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="bottom"
android:layout_margin="#dimen/abc_action_bar_default_padding_material"
android:ellipsize="end"
android:gravity="center_vertical"
android:maxLines="1"
android:minHeight="?attr/actionBarSize"
android:textColor="#android:color/white"
android:textSize="20sp" />
</FrameLayout>
<com.bright.nongkrongyuk.ui.SlidingTabLayout
android:id="#+id/sliding_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#android:color/black"
app:sliding_textColor="#drawable/sliding_tab_profile" />
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/background_light" />
</LinearLayout>
</com.github.ksoichiro.android.observablescrollview.TouchInterceptionFrameLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/transparent"
android:minHeight="?attr/actionBarSize"
android:fitsSystemWindows="true" />
</FrameLayout>
The android:fitsSystemWindows attribute sets a padding. This means the fitting applies to the child views. You would have to apply this either to your FrameLayout or put the Toolbar into a nested Layout
It's really tricky to make a proper fullscreen layout with views fitted to the screen. I subclassed Fragment where I can declare a content-view which will get padding depending on Status- and/or Navigationbar