I have a TabLayout having menus and a chat screen, Previously the TabLayout was align on top of the screen. I just change the Tab layout to bottom,
After TabLayout change to bottom when comes to chat screen (chat screen edit text in bottom position) UI is flickering
Now chat edit text shows just above of TabLayout, I don't know is it related to focus issue
is there any reason for UI flickering ?
Layout
<?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"
tools:ignore="MissingPrefix">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="#color/white"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:elevation="0dp">
<android.support.v7.widget.Toolbar
android:id="#+id/tb_toolbar_main_activity"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/transparent"
app:layout_scrollFlags="enterAlways"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal">
<TextView
android:id="#+id/tb_heading"
fontPath="#string/font_bebas_neue_bold"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginEnd="15dp"
android:layout_marginRight="15dp"
android:text="#string/app_name_caps"
android:textAlignment="center"
android:textColor="#color/heading_color"
android:textSize="#dimen/toolbar_title_text" />
</LinearLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
app:tabBackground="#drawable/tab_back_selected"
app:tabIndicatorHeight="0dp"
app:tabMode="fixed"
app:tabGravity="fill"
app:tabSelectedTextColor="#android:color/white"
app:tabTextAppearance="#style/MyTabLayoutTextAppearance"
app:tabTextColor="#color/home_sub_text" />
<android.support.v4.view.ViewPager
android:id="#+id/vp_activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_below="#id/app_bar"
android:layout_above="#id/tabs"/>
</RelativeLayout>
Related
I have a ViewPager that shows 3 fragments. One of the fragments has got a WebView and I am experiencing 2 issues:
1) It seems that the size of the ViewPager (height) is bigger than the screen size. (see following image)
2) Scrolling is working correctly when switching from a tab to another on, while it is not working vertically when the APP is landscape orientation.
When in landscape mode I can scroll up the page touching the toolbar and the TabLayout but I cannot scroll up touching the WebView.
What I am trying to do is to scroll up touching the WebView and not only the Tab or Toolbar.How can I do that?
activity_main.xml
<?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"
android:orientation="vertical"
tools:context="com.it.rocks4x4.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|snap"
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"
app:tabMode="fixed"
app:layout_scrollFlags="scroll|enterAlways|snap"
app:tabGravity="fill"/>
</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" />
<!--
<TextView android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="REGISTRA"
android:elevation="6dp"
android:textSize="18dp"
android:textColor="#color/black"
app:layout_anchor="#id/fab"
app:layout_anchorGravity="center"/>-->
<TextView
android:id="#+id/fab"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="end|bottom"
android:layout_margin="10dp"
android:background="#drawable/button_shape"
android:elevation="10dp"
android:fontFamily="sans-serif"
android:gravity="center"
android:text="#string/msg_inizia_registrare"
android:textColor="#FFF"
android:textSize="#dimen/size25sp"
android:textStyle="bold"
tools:layout_editor_absoluteX="28dp" />
</android.support.design.widget.CoordinatorLayout>
fragment
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="#color/black"
tools:context="com.it.rocks4x4.activities.MainActivity$PlaceholderFragment">
<WebView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/webviewbussola"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_alignParentBottom="true" />
</RelativeLayout>
Thanks
I want the gridview to start from under the tablayout(marked red) but be scrollable beneath the transparent toolbar and the tablayout. I tried to set marginTop to the gridview but the gridview stays fixed in that place and doesn't scroll underneath the toolbar and tablayout. Is there any way to set margin to the 1st row of the gridview?
My XML code :
<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=".Fragments.CompetitionFragment">
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="25dp"
android:background="#color/statusBarColor"
android:theme="#style/AppTheme.AppBarOverlay"
app:layout_scrollFlags="scroll|enterAlways">
<android.support.v7.widget.Toolbar
android:id="#+id/comptoolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="24dp"
android:background="#color/statusBarColor"
app:layout_scrollFlags="scroll|enterAlways">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
android:gravity="center_vertical"
android:orientation="horizontal">
<TextView
android:id="#+id/glostarslogo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Competition"
android:textColor="#color/white"
android:textSize="20sp"
android:visibility="visible" />
<View
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:visibility="invisible" />
</LinearLayout>
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
style="#style/MyTabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
app:tabIndicatorColor="#color/white"
app:tabIndicatorHeight="3dp"
app:tabMode="fixed" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/fabs" />
</android.support.design.widget.CoordinatorLayout>
in my app I have an activity with 3 tabs implemented with view pager and tab layout, one of them is a chat fragment.
the problem is that at the bottom of this fragment layout i have EditText and send button, which are hidden under the screen borders, when i scroll down with the nested scrolling it can be seen in the images:
EditText and send button hidden
EditText and send button apear
the activity layout .xml:
<android.support.design.widget.CoordinatorLayout
android:id="#+id/activity_event_details"
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"
tools:context=".eventdetails.EventDetailsActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:fitsSystemWindows="true"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="?attr/colorPrimary"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_scrollFlags="scroll|enterAlways">
<ImageButton
android:fitsSystemWindows="true"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="right"
android:src="#drawable/ic_launcher"
android:id="#+id/event_creator_button"
android:background="#00000000"
android:nestedScrollingEnabled="true" />
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
android:background="?attr/colorPrimary"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"/>
</android.support.design.widget.AppBarLayout>
<!--<LinearLayout-->
<!--android:layout_width="match_parent"-->
<!--android:layout_height="match_parent"-->
<!--android:orientation="vertical"-->
<!--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"
android:layout_below="#id/tab_layout"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>
the fragment layout(I don't think the problem is here but-for any case..):
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".eventdetails.EventChatFragment">
<ListView
android:id="#+id/messageListView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/linearLayout"/>
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:orientation="horizontal">
<EditText
android:id="#+id/messageEditText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"/>
<Button
android:id="#+id/sendButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:enabled="false"
android:text="SEND"/>
</LinearLayout>
</RelativeLayout>
I can't figure out what is the reason the app is "extend" the screen, and how to fix it. tried to search a lot but nothing helped..
thank's a lot!
I assume you created this activity layout through the android studio wizard choosing e.g. basic layout? Open the visual editor and you will see your LinearLayout with height=match_parent will have a hidden bottom part. For me I changed the android.support.design.widget.CoordinatorLayout to RelativeLayout and used this to place the content below the toolbar.
Watch the blue border: http://postimg.org/image/dz1x2y6gb/
http://postimg.org/image/xse0vnju3/
I also came across this problem when noticing that the last items of my ListView weren't showing.
EDIT
try this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:id="#+id/activity_event_details"
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"
tools:context=".eventdetails.EventDetailsActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:fitsSystemWindows="true"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="?attr/colorPrimary"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_scrollFlags="scroll|enterAlways">
<ImageButton
android:fitsSystemWindows="true"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="right"
android:src="#drawable/ic_launcher"
android:id="#+id/event_creator_button"
android:background="#00000000"
android:nestedScrollingEnabled="true" />
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
android:background="?attr/colorPrimary"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"/>
</android.support.design.widget.AppBarLayout>
<!--<LinearLayout-->
<!--android:layout_width="match_parent"-->
<!--android:layout_height="match_parent"-->
<!--android:orientation="vertical"-->
<!--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"
android:layout_below="#id/appBarLayout"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</RelativeLayout>
Here is the screenshot of my problem. As you can see, on the very right bottom of the screen my floating button is covered by the navigation bar. Could anyone help me with this? I am already using padding on my layout.
I tried using android:fitsSystemWindows="true", but it didn't help.
XML File for the fragment:
<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:padding="15dp"
android:fitsSystemWindows="true">
<android.support.design.widget.FloatingActionButton
android:id="#+id/addNewReminderButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:src="#drawable/ic_add"
app:backgroundTint="#color/md_amber_500"
app:elevation="4dp" />
</RelativeLayout>
Here is the XML containing Toolbar, AppBar and so on.
<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/MaterialTheme">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/MaterialTheme" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="fixed"
app:tabGravity="fill"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
Here is my main layout :
<LinearLayout 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="fill_parent"
android:animateLayoutChanges="true"
android:orientation="vertical">
<RelativeLayout
android:id="#+id/top_con"
android:layout_width="match_parent"
android:layout_height="64dp"
android:background="#cc0000">
<TextView
android:id="#+id/close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:clickable="true"
android:text="Close"
android:textColor="#ffffff" />
</RelativeLayout>
<android.support.design.widget.CoordinatorLayout
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/blue"
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>
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/green"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
After event onClick on TextView (id/close), I set visibility for RelativeLayout (id/top_con) to GONE. But FrameLayout (contain a recycler view) still keep their height, and there's a white space (white is background color of CoordinatorLayout ) at bottom of sreen.
What is problem and how can fix it?
Thank you!