I have a view with some fragments and I created a snackbar with a slide animation on it. The animation works fine, but before it comes up a white window appears where the snackbar is going to appear.
It is happening because I am using setTranslationY on the view. I tried to put the background transparent but it did not work.
How can I solve it?
<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="wrap_content"
android:background="#android:color/transparent">
<LinearLayout
android:id="#+id/pager_activity_page"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#android:color/transparent">
<FrameLayout
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#android:color/transparent"
android:layout_weight="1"
/>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="#android:color/black"
android:id="#+id/snackbar_container"
android:visibility="gone">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:textColor="#android:color/white"
android:textSize="13sp"
android:textStyle="normal"
android:id="#+id/snackbar_text"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:layout_gravity="center" />
</FrameLayout>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
style="#style/MyCustomTabLayout"
app:tabGravity="fill"
app:tabMode="fixed"
android:background="#android:color/white"
app:tabIndicatorColor="#android:color/white"
app:tabSelectedTextColor="#color/bpBlue"
app:tabTextColor="#929292"
/>
</LinearLayout>
</RelativeLayout>
Did you build your own "snackbar"? Try to use this:
http://www.androidhive.info/2015/09/android-material-design-snackbar-example/
But your problem:
I think the problem is, that your add your "snackbar" in your linear layout! You set the visibility to "gone" and your bar will not use any space. On your animation you set the visibility to "visible". The linear layout will give you the space, which you need for you bar. You need to add the bar above your layout(also the tablayout)
Related
Problem 1:
I have made my toolbar transparent but There is some sort of overlay effect which I don't want. How can I remove that effect? I have marked that place(1) in a sample image.
code for ToolBar:
<android.support.design.widget.AppBarLayout
android:id="#+id/cvSlider"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="0dp"
android:layout_marginTop="20dp"
app:theme="#style/CustomActionBar"
android:background="#android:color/transparent">
<include layout="#layout/toolbar_layout" />
</android.support.design.widget.AppBarLayout>
ToolBarLayOut:
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="0dp"
android:background="#color/transparent"
android:minHeight="?attr/actionBarSize"
>
<RelativeLayout
android:layout_width="match_parent"
android:gravity="center"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/location_ic"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_location"
/>
<TextView
android:layout_toRightOf="#id/location_ic"
android:id="#+id/toolbar_title"
android:padding="6dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:fontFamily="#font/custom_font"
android:text="서울 서초구 강남역 주변"
android:textColor="#color/colorWhite" />
<ImageView
android:layout_width="wrap_content"
android:src="#drawable/ic_arrow_drop_down"
android:layout_toRightOf="#id/toolbar_title"
android:layout_height="wrap_content" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
Problem 2: I am using a scroll view with a child list view in my app. but the problem is when I am taping any white space(marked 2) o list item parent scroll is not working but when taping on images then the parent scroll works (Marked 3). only the child list view scroll is working which I don't want I want the parent scroll to work here.
AppBarLayout has StateListAnimator by default try setting it to null using below code
<android.support.design.widget.AppBarLayout
android:id="#+id/cvSlider"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="0dp"
android:layout_marginTop="20dp"
android:stateListAnimator="#null"
app:theme="#style/CustomActionBar"
android:background="#android:color/transparent">
<include layout="#layout/toolbar_layout" />
</android.support.design.widget.AppBarLayout>
I have take custom layout inside the toolbar and perform action according to it.
but in some case i want make toolbar transparent so when i have set app:elevation="0dp" than it will hide my custom layout but still action will performed when click on that area.
I have used following layout inside toolbar.
Edited
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarMain"
app:elevation="0dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:background="#null"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/iv_menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:background="?attr/selectableItemBackgroundBorderless"
android:clickable="true"
android:contentDescription="#null"
android:padding="#dimen/activity_vertical_margin"
android:src="#drawable/ic_menu" />
<FrameLayout
android:id="#+id/frmNotification"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toEndOf="#+id/iv_menu"
android:layout_toRightOf="#+id/iv_menu"
android:background="?attr/selectableItemBackgroundBorderless"
android:clickable="true"
android:padding="#dimen/padding_5">
<ImageView
android:id="#+id/iv_notification"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:contentDescription="#null"
android:padding="#dimen/padding_5"
android:src="#drawable/ic_notification" />
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_marginTop="#dimen/padding_5"
android:background="#drawable/bg_bage">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="#string/eight"
android:textColor="#android:color/white"
android:textSize="#dimen/font_8" />
</FrameLayout>
</FrameLayout>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/frmNotification"
android:contentDescription="#null"
android:src="#drawable/logo_header" />
<ImageView
android:id="#+id/ivElasticSearch"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:paddingLeft="#dimen/padding_10"
android:paddingRight="#dimen/padding_15"
android:src="#drawable/ic_search" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
How to overcome this issue because in some scenario we want transparent toolbar but icon inside it should be display.
Here I have attached image how actually look like.
Your idea of app:elevation="someValue" is wrong, it does not hide the toolbar.The attribute app:elevation is used to show how much you want to make the toolbar or any other view that supports that attribute raised above the surface. Consider the surface as the floor on which the views are placed, now if you want to show some view like toolbar raised to other views you use that attribute.
if you want to make it transparent do it like this.
According to Material Design Guidelines, the elevation for appbar should be 4dp. So you should not set it to 0dp.
Use android:background="#null" instead of app:elevation="0dp".
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarMain"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#null">
EDIT
You want to remove the shadow of the toolbar. To do that use app:elevation="0dp" only for appbar layout. Your code before revision shows you used for both toolbar and appbar. Remove it for toolbar.
UPDATE
I tested the code and the following code seemed to do the work.
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/testbg">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarMain"
app:elevation="0dp"
android:background="#null"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:background="#null"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
<!-- Rest of the code -->
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
</RelativeLayout>
OUTPUT IMAGE
I know this type of problem already discussed here so many times . But in my case none of them working for me . I am using AndroidSlidingUpPanel in my project with navigation drawer. The problem is sliding panel layout always showing over navigation drawer , but what I want is reverse . Here is the current condition
As you can see I can't see the navigation drawer items . Sliding panel layout hides the navigation drawer .
Here is my code
<?xml version="1.0" encoding="utf-8"?>
<com.sothree.slidinguppanel.SlidingUpPanelLayout xmlns:sothree="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/sliding_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="bottom"
sothree:umanoDragView="#+id/dragView"
sothree:umanoOverlay="false"
sothree:umanoPanelHeight="68dp"
sothree:umanoParalaxOffset="100dp"
sothree:umanoShadowHeight="4dp">
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/drawerMainActivity"
android:layout_width="match_parent"
android:layout_alignParentBottom="true"
android:layout_height="match_parent">
<FrameLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/containerView">
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?android:attr/actionBarSize"
android:background="?attr/colorPrimary"
android:id="#+id/toolBar"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark"
/>
</FrameLayout>
<android.support.v7.widget.RecyclerView
android:layout_width="240dp"
android:layout_height="match_parent"
android:id="#+id/recyclerView"
android:scrollbars="vertical"
android:background="#FFFFFF"
android:layout_gravity="left"
/>
</android.support.v4.widget.DrawerLayout>
<!-- SLIDING LAYOUT -->
<LinearLayout
android:id="#+id/dragView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:clickable="true"
android:focusable="false"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/name"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:textColor="#android:color/holo_green_dark"
android:gravity="center_vertical"
android:paddingLeft="10dp"
android:text="#string/slide"
android:textSize="14sp" />
<Button
android:id="#+id/btn_hide"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center_vertical|right"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:text="#string/hide"
android:textSize="14sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FFCCCC">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:layout_weight="1"
android:scaleType="centerCrop"
android:src="#drawable/image" />
</LinearLayout>
</LinearLayout>
</com.sothree.slidinguppanel.SlidingUpPanelLayout>
How can I solve this problem ? So that navigation drawer always comes top over sliding panel layout .
Set your DrawerLayout as the root element, instead of your SlidingUpPanelLayout
To set the Z-axis you have to order the tree. From the documentation
View.html#Drawing
The tree is largely recorded and drawn in order, with parents drawn
before (i.e., behind) their children, with siblings drawn in the order
they appear in the tree. If you set a background drawable for a View,
then the View will draw it before calling back to its onDraw() method.
The child drawing order can be overridden with custom child drawing
order in a ViewGroup, and with setZ(float) custom Z values} set on
Views.
So basically set the Drawerlayout as last.
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
I have Activity with bottom navigation bar (via roughike BottomBar library). It's look like this:
When i'm trying to scroll page, bottom bar hides automatically. So, I get this:
I want avoid this effect. I do not want hide bottom bar when I'm just trying to scroll content but all content lies on screen.
But if page contains content more than one screen then bottom bar must hides on scroll (and now it's works fine).
My code doesn't have any listeners for scroll and my xml file looks like this:
<android.support.design.widget.CoordinatorLayout
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"
tools:context=".presentation.ui.mainactivity.MainActivity"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/mainCord" >
<android.support.design.widget.AppBarLayout
android:id="#+id/sliderContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent"
android:background="#color/primary"
android:theme="#style/ToolbarStyle"
app:titleTextAppearance="#style/ToolbarStyle" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:visibility="gone" />
<com.roughike.bottombar.BottomBar
android:id="#+id/bottomBar"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_gravity="bottom"
app:bb_tabXmlResource="#xml/bottom_bar_tabs"
app:bb_activeTabColor="#color/white"
app:bb_inActiveTabColor="#color/bottom_bar_inactive_tab"
app:bb_inActiveTabAlpha="1"
app:bb_behavior="shy|shifting" />
</android.support.design.widget.CoordinatorLayout>
I'm looked for solution for my problem but found nothing. What can i do for avoid this effect?
UPDATED:
FAB is inside ViewPager. Layout for tab on screenshot look like this:
<?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:id="#+id/eventCoordinatorLayout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/refresh"
android:visibility="visible"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.v7.widget.RecyclerView
android:id="#+id/eventsRecyclerView"
android:scrollbars="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v4.widget.SwipeRefreshLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity = "center"
android:gravity="center" >
<TextView
android:id="#+id/emptyText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/secondary_text"
android:textSize="16sp"
android:gravity="center"
android:text="#string/empty_events_text"
android:drawableTop="#drawable/ic_no_calendar"
android:drawablePadding="4dp"
android:visibility="gone" />
<TextView
android:id="#+id/createEventText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/create_event_text"
android:textColor="#color/secondary_text"
android:textSize="16sp"
android:visibility="gone" />
<TextView
android:id="#+id/createEventButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/primary"
android:text="#string/create_event"
android:textSize="16sp"
android:visibility="gone" />
</LinearLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/createEvent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:src="#drawable/ic_add_white_24dp"
style="#style/floating_action_button"
app:layout_anchor="#id/eventsRecyclerView"
app:layout_anchorGravity="bottom|end"
app:borderWidth="0dp"
app:elevation="6dp"
app:pressedTranslationZ="12dp" />
<RelativeLayout
android:id="#+id/loadingPanel"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center" >
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:indeterminate="true" />
</RelativeLayout>
</android.support.design.widget.CoordinatorLayout>
app:bb_behavior="underNavbar"
You have an issue in the following code
<com.roughike.bottombar.BottomBar
android:id="#+id/bottomBar"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_gravity="bottom"
app:bb_tabXmlResource="#xml/bottom_bar_tabs"
app:bb_activeTabColor="#color/white"
app:bb_inActiveTabColor="#color/bottom_bar_inactive_tab"
app:bb_inActiveTabAlpha="1"
app:bb_behavior="shy|shifting" />
replace the
app:bb_behavior="shy|shifting"
with
app:bb_behavior="underNavbar"
Hope this works for you!
Check your manifest FILE and make sure you're not using full screen theme...However, you can use the following code to hide and show the bar on android higher than API 19. To hide the bar, just change VISIBLE to GONE, and make sure you call the showNavBar() method in both your onCreate() and onResume() method
public void showNavBar() {
View view = getWindow().getDecorView();
view.setSystemUiVisibility(View.VISIBLE);
}
I had the same issue, I fixed it by doing this:
In activity_main.xml add this to the CoordinatorLayout:
android:fitsSystemWindows="true"
The viewpager should be like this:
<android.support.v4.view.ViewPager
android:background="#color/colorPrimary"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
And in all your Fragments, they should start with NestedScrollView and must contain (fillViewport):
<android.support.v4.widget.NestedScrollView 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/constraintLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
tools:context="com.khan.junaid.phonefans.MainActivity">
<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/fans_list_view"
/>
</android.support.v4.widget.NestedScrollView>
These settings will make the fragments scrollable, and the content will no more be hiding behind the Navigation bar buttons.