I am trying to make my EditText take up the remaining empty space of the screen between the toolbar on top and the wide submit button on the bottom.
However, when I use match_parent for that EditText, the counter runs off screen (ends up behind the button). I can't seem to figure out how to make it show.
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.myapp.app.PostActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/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"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:overScrollMode="never"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<LinearLayout
android:id="#+id/textLinearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
>
<android.support.design.widget.TextInputLayout
android:id="#+id/textContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="vertical"
app:counterEnabled="true"
app:counterMaxLength="300">
<EditText
android:id="#+id/EditText"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#00000000"
android:gravity="top|left"
android:inputType="textMultiLine|textCapSentences"
android:maxLength="300"
android:scrollbars="vertical"/>
</android.support.design.widget.TextInputLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/submitArea"
android:layout_width="match_parent"
android:layout_height="60dp"
android:orientation="horizontal">
<Button
android:id="#+id/postButton"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Submit" />
</LinearLayout
</LinearLayout>
Here is what it looks like right now:
Here is what I want it to look like (with the 0/300 counter on the bottom right):
Try using RelativeLayout instead, think the problem is with your layouts:
<?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:context="com.myapp.app.PostActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/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"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:overScrollMode="never"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<LinearLayout
android:id="#+id/textLinearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/appBarLayout"
android:layout_above="#id/submitArea"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
>
<android.support.design.widget.TextInputLayout
android:id="#+id/textContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="vertical"
app:counterEnabled="true"
app:counterMaxLength="300">
<EditText
android:id="#+id/EditText"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#00000000"
android:gravity="top|left"
android:inputType="textMultiLine|textCapSentences"
android:maxLength="300"
android:scrollbars="vertical"/>
</android.support.design.widget.TextInputLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/submitArea"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_alignParentBottom="true"
android:orientation="horizontal">
<Button
android:id="#+id/postButton"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Submit" />
</LinearLayout>
</RelativeLayout>
The tricks are using android:layout_below and android:layout_above for your middle layout, and android:layout_alignParentBottom="true" for your submit button.
Hope this helps ;)
Try below updated xml code for your layout:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".AppTourActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/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"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:overScrollMode="never"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<LinearLayout
android:id="#+id/textLinearLayout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="vertical"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin">
<android.support.design.widget.TextInputLayout
android:id="#+id/textContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="vertical"
app:counterEnabled="true"
app:counterMaxLength="300">
<EditText
android:id="#+id/EditText"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#00000000"
android:gravity="top|left"
android:inputType="textMultiLine|textCapSentences"
android:maxLength="300"
android:scrollbars="vertical" />
</android.support.design.widget.TextInputLayout>
</LinearLayout>
<TextView
android:id="#+id/tvCounter"
tools:text="0/300"
android:layout_alignParentBottom="true"
android:layout_width="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="10sp"
android:layout_height="wrap_content" />
</RelativeLayout>
<LinearLayout
android:id="#+id/submitArea"
android:layout_width="match_parent"
android:layout_height="60dp"
android:orientation="horizontal">
<Button
android:id="#+id/postButton"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Submit" />
</LinearLayout>
</LinearLayout>
Output:
I hope its helps you.
Related
I'm trying to put an editText below the frameLayout. It works when the editText comes before the frameLayout but not after.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!--TODO: Move to Fragment to enable hideOnScroll flag-->
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary"
android:id="#+id/toolbar"
app:layout_scrollFlags="enterAlways|scroll">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:textSize="18sp"
android:id="#+id/toolbarTitle"/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/container">
</FrameLayout>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
I'm expecting the editText to show up after the frameLayout, but it just doesnt show up at all.
You can always use ConstraintLayout
here is the code:
<ConstraintLayout 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/linearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<!--TODO: Move to Fragment to enable hideOnScroll flag-->
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
app:layout_scrollFlags="enterAlways|scroll">
<TextView
android:id="#+id/toolbarTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:textSize="18sp" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<EditText
android:id="#+id/editText"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<FrameLayout
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/editText"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/appBarLayout">
</FrameLayout>
</ConstraintLayout>
EditText not showing because you have set frameLayout height match parent
Change child LinearLayout to RelativeLayout
Try this
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:id="#+id/activity_main"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent"
tools:context="com.journaldev.retrofitintro.MainActivity">
<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">
<!--TODO: Move to Fragment to enable hideOnScroll flag-->
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary"
android:id="#+id/toolbar"
app:layout_scrollFlags="enterAlways|scroll">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:textSize="18sp"
android:id="#+id/toolbarTitle"/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/appBarLayout"
android:layout_above="#+id/edit_query"
android:id="#+id/container">
</FrameLayout>
<EditText
android:id="#+id/edit_query"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</RelativeLayout>
</LinearLayout>
Use layout_weight for FrameLayout and make layout_height="0dp"
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
...
...
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp" // make this "0dp"
android:layout_weight="1" // add this
android:id="#+id/container">
</FrameLayout>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
When click EditTextform, keyboard pops up and pushes actionbars up only second fragment.
I'm using ViewPager in MainActiviy. Above screenshot is in the second fragment of 3.
This is layout of second fragment.
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginBottom="30dp"
android:background="#color/editTextColor"
>
<EditText
android:layout_width="match_parent"
android:layout_height="match_parent"
android:inputType="text"
android:hint="Query"
android:ems="10"
android:id="#+id/query"
android:layout_weight="0.3"
/>
<Button
android:backgroundTint="#color/button1"
android:textColor="#color/buttonText"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:drawableTop="#drawable/search_picto"
android:id="#+id/searchBooks"
android:layout_weight="0.7"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="8dp"
android:baselineAligned="false">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="2dp"
android:layout_marginEnd="2dp"
android:orientation="vertical"
android:layout_weight="1">
<com.seokyeong.adw.sku_library.custormizes.SquareDrawableButton
android:drawableTop="#drawable/seat_info_picto"
android:backgroundTint="#color/button1"
android:layout_width="match_parent"
android:layout_height="120dp"
android:id="#+id/seat_info"
/>
<com.seokyeong.adw.sku_library.custormizes.SquareDrawableButton
android:backgroundTint="#color/button1"
android:layout_width="match_parent"
android:layout_height="120dp"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="2dp"
android:layout_marginEnd="2dp"
android:orientation="vertical"
android:layout_weight="1">
<com.seokyeong.adw.sku_library.custormizes.SquareDrawableButton
android:drawableTop="#drawable/pt_room_picto"
android:backgroundTint="#color/button1"
android:text="시설 예약"
android:id="#+id/room_reservation"
android:layout_width="match_parent"
android:layout_height="120dp"
/>
<com.seokyeong.adw.sku_library.custormizes.SquareDrawableButton
android:backgroundTint="#color/button1"
android:layout_width="match_parent"
android:layout_height="120dp"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="2dp"
android:layout_marginEnd="2dp"
android:orientation="vertical"
android:layout_weight="1">
<com.seokyeong.adw.sku_library.custormizes.SquareDrawableButton
android:backgroundTint="#color/button1"
android:drawableTop="#drawable/bookmark_picto"
android:id="#+id/bookmarks"
android:text="관심 도서"
android:layout_width="match_parent"
android:layout_height="120dp"
/>
<com.seokyeong.adw.sku_library.custormizes.SquareDrawableButton
android:backgroundTint="#color/button1"
android:layout_width="match_parent"
android:layout_height="120dp"
/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
I already tried adding adjustNothing or adjustPan option in the MainActiviy, AndroidManifest.xml. But It's not work.
Also add getActivity().getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_HIDDEN |WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE);
in my fragments class
How can stop keyboard ruin the layout?
Activity.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"
tools:context="com.seokyeong.adw.sku_library.activitys.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.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:background="#color/main_background"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
Try this in manifest.xml of your activity
android:windowSoftInputMode="adjustResize"
Try removing this line - app:layout_scrollFlags="scroll|enterAlways" from your toolBar View.
remove this line from ViewPager app:layout_behavior="#string/appbar_scrolling_view_behavior"
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:background="#color/main_background"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
I got problem with LinearLayout, it only shows the first child. I found a solution but i not work.
Here my 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:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.example.hoangdang.diemdanh.QRCode.QRCodeActivity">
<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/qrcode_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/primary_darker"
app:popupTheme="#style/AppTheme.PopupOverlay"/>
</android.support.design.widget.AppBarLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:orientation="horizontal">
<android.support.v7.widget.AppCompatImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/qrCode_imageView"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"/>
<android.support.v7.widget.AppCompatButton
android:id="#+id/generate_code_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/generate_code"
android:layout_marginRight="#dimen/de_btn_padding"
android:layout_marginLeft="#dimen/de_btn_padding"/>
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
here is the result when i change position of Button and ImageView
and
I think you have to set orientation vertical to linear layout like below
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.example.hoangdang.diemdanh.QRCode.QRCodeActivity">
<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/qrcode_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/primary_darker"
app:popupTheme="#style/AppTheme.PopupOverlay"/>
</android.support.design.widget.AppBarLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:orientation="vertical">
<android.support.v7.widget.AppCompatImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/qrCode_imageView"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"/>
<android.support.v7.widget.AppCompatButton
android:id="#+id/generate_code_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/generate_code"
android:layout_marginRight="#dimen/de_btn_padding"
android:layout_marginLeft="#dimen/de_btn_padding"/>
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
You have defined ImageView's width as MATCH_PARENT so it will take the whole of it's parent and while the parent is HORIZONTAL then the second view will never shown. this may help you
<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/qrcode_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/primary_darker"
app:popupTheme="#style/AppTheme.PopupOverlay"/>
</android.support.design.widget.AppBarLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:orientation="horizontal">
<android.support.v7.widget.AppCompatImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/qrCode_imageView"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"/>
<android.support.v7.widget.AppCompatButton
android:id="#+id/generate_code_button"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/generate_code"
android:layout_marginRight="#dimen/de_btn_padding"
android:layout_marginLeft="#dimen/de_btn_padding"/>
</LinearLayout>
you can try this using weight attribute in image and button
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:orientation="horizontal">
<android.support.v7.widget.AppCompatImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/qrCode_imageView"
android:layout_weight="1"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"/>
<android.support.v7.widget.AppCompatButton
android:id="#+id/generate_code_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/generate_code"
android:layout_marginRight="#dimen/de_btn_padding"
android:layout_marginLeft="#dimen/de_btn_padding"/>
I am trying do transparent toolbar that has to overlap other view. But conversely other view overlap toolbar.
In xml I specially used margintop for RelativeLayout that show overlapping. Actually I don't use marginTop for RelativeLayout.
xml
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:tools="http://schemas.android.com/tools"
tools:context=".activity.activitys.ActivityImage">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:gravity="center">
<android.support.v7.widget.AppCompatTextView
android:id="#+id/action_bar_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Фото"/>
</android.support.v7.widget.Toolbar>
<RelativeLayout
android:layout_marginTop="30dp"
android:id="#+id/img_slideshow_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/img_border"
>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
<kz.dreamwings.zhaksyadam.activity.util.CircleIndicator
android:id="#+id/indicator"
android:layout_width="fill_parent"
android:layout_height="55dp"
android:padding="3dip"
android:background="#99000000"
android:layout_above="#+id/img_name"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_alignParentBottom="true"/>
</RelativeLayout>
</FrameLayout>
You are using FrameLayout which is basically for holding a single child. You cant manage the alignment of childrens in FrameLayout.
Your layout should be 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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<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"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:gravity="center">
<android.support.v7.widget.AppCompatTextView
android:id="#+id/action_bar_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Фото" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:descendantFocusability="blocksDescendants"
android:scrollbars="none"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<RelativeLayout
android:id="#+id/img_slideshow_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/img_border">
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<kz.dreamwings.zhaksyadam.activity.util.CircleIndicator
android:id="#+id/indicator"
android:layout_width="fill_parent"
android:layout_height="55dp"
android:layout_above="#+id/img_name"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:background="#99000000"
android:padding="3dip" />
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
change your code like this:
<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"
xmlns:tools="http://schemas.android.com/tools"
android:background="#drawable/img_border"
tools:context=".activity.activitys.ActivityImage">
<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:gravity="center">
<android.support.v7.widget.AppCompatTextView
android:id="#+id/action_bar_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Фото"/>
</android.support.v7.widget.Toolbar>
<RelativeLayout
android:layout_marginTop="30dp"
android:id="#+id/img_slideshow_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
.
.
.
Try this: add toolbar after relative layout and remove top margin .
.i.e:
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:tools="http://schemas.android.com/tools"
tools:context=".activity.activitys.ActivityImage">
<RelativeLayout
android:id="#+id/img_slideshow_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/img_border"
>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
<kz.dreamwings.zhaksyadam.activity.util.CircleIndicator
android:id="#+id/indicator"
android:layout_width="fill_parent"
android:layout_height="55dp"
android:padding="3dip"
android:background="#99000000"
android:layout_above="#+id/img_name"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_alignParentBottom="true"/>
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:gravity="center">
<android.support.v7.widget.AppCompatTextView
android:id="#+id/action_bar_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Фото"/>
</android.support.v7.widget.Toolbar>
</FrameLayout>
I'm trying to recreate the search box as it is in Airbnb Android app.
So I'm using CoorinatorLayout with Toolbar and RecyclerView.
But when I insert something inside the Coordinator besides those two things, it doesn't show up.
Here is my code:
<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/slidingLayout"
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.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/red"
app:layout_scrollFlags="scroll|enterAlways" />
</android.support.design.widget.AppBarLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="50dp"
android:layout_marginRight="50dp"
android:layout_marginTop="20dp"
android:background="#drawable/rounded_background"
android:orientation="horizontal"
android:padding="6dp"
app:layout_scrollFlags="scroll|enterAlways">
<EditText
android:id="#+id/search"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="6"
android:background="#null"
android:fontFamily="sans-serif-light"
android:hint="Unesite grad"
android:paddingLeft="16dp"
android:paddingStart="16dp" />
<ImageView
android:id="#+id/cancelSearch"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_weight="1"
android:padding="10dp"
android:src="#drawable/ic_cancel" />
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="#id/appbar"
android:background="#ffffff"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
But actually if this even worked, I would have the trouble of putting the search box above the RecyclerView.
I have tried to put everything inside the RelativeLayout but that didn't work.
Here is also the picture of what I'm trying to make
EDIT:
Here is the code with RelativeLayout
<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/slidingLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
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:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:background="#00000000">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/red"
app:layout_scrollFlags="scroll|enterAlways"/>
</android.support.design.widget.AppBarLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="50dp"
android:layout_marginRight="50dp"
android:layout_marginTop="20dp"
android:background="#drawable/rounded_background"
android:orientation="horizontal"
android:padding="6dp"
app:layout_scrollFlags="scroll|enterAlways">
<EditText
android:id="#+id/search"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="6"
android:background="#null"
android:fontFamily="sans-serif-light"
android:hint="Unesite grad"
android:paddingLeft="16dp"
android:paddingStart="16dp" />
<ImageView
android:id="#+id/cancelSearch"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_weight="1"
android:padding="10dp"
android:src="#drawable/ic_cancel" />
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="#id/appbar"
android:background="#ffffff"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</RelativeLayout>
I was trying to do something a little similar, but with an ad banner at the bottom of the screen. My solution was to wrap the RelativeLayout outside the CoordinatorLayout as so:
<?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:id="#+id/main_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/ad_view">
<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>
<android.support.v7.widget.RecyclerView
android:id="#+id/my_list_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
<com.google.android.gms.ads.AdView
android:id="#+id/ad_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:layout_gravity="center|bottom"
app:adSize="SMART_BANNER"
app:adUnitId="#string/admob_id" />
</RelativeLayout>
The toolbar properly hides when scrolling inside the RecyclerView and everything seems to be working just fine. I would imagine if you followed a similar principle you should be good-to-go.
If you want remove status bar white colour, you must remove the next line
<item name="android:statusBarColor">#android:color/transparent</item>`
in v21/styles.xml
Thanks for example.
<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/slidingLayout"
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.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/red"
app:layout_scrollFlags="scroll|enterAlways"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="50dp"
android:layout_marginRight="50dp"
android:layout_marginTop="20dp"
android:background="#drawable/rounded_background"
android:orientation="horizontal"
android:padding="6dp"
app:layout_scrollFlags="scroll|enterAlways">
<EditText
android:id="#+id/search"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="6"
android:background="#null"
android:fontFamily="sans-serif-light"
android:hint="Unesite grad"
android:paddingLeft="16dp"
android:paddingStart="16dp"/>
<ImageView
android:id="#+id/cancelSearch"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_weight="1"
android:padding="10dp"
android:src="#drawable/ic_cancel" />
</LinearLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="#id/appbar"
android:background="#ffffff"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>
Check if this works for you.