Menu
I want use android.support.design.widget.CoordinatorLayout , android.support.design.widget.AppBarLayout , android.support.design.widget.CollapsingToolbarLayout in my xml file. What are the possibilities to position a view below another view?
for example : position ScrollView beneath ImageView in CoordinatorLayout.
my xml code :
<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="@color/background_color" tools:context="com.tellfa.smsbox.activities.postShow_Page"> <android.support.design.widget.CoordinatorLayout android:id="@+id/post_show_coordinator" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.design.widget.AppBarLayout android:id="@+id/app_bar_layout" android:layout_width="match_parent" android:layout_height="wrap_content"> <android.support.design.widget.CollapsingToolbarLayout android:id="@+id/post_show_collapsing_toolbar_layout" android:layout_width="match_parent" android:layout_height="wrap_content" app:contentScrim="?attr/colorPrimary" app:layout_scrollFlags="scroll|enterAlways" > <ImageView android:id="@+id/post_picture_image" android:layout_width="fill_parent" android:layout_height="200dp" android:scaleType="centerCrop" android:src="@drawable/cover_menu_bg2" android:visibility="visible" app:layout_collapseMode="parallax" /> <android.support.v7.widget.Toolbar android:id="@+id/post_show_app_bar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" app:layout_collapseMode="pin"> <ImageView android:id="@+id/post_show_fav_image" android:layout_width="25dp" android:layout_height="25dp" android:layout_gravity="right" android:layout_marginRight="10dp" android:alpha="0.7" android:src="@drawable/favorite_post_un" /> <ImageView android:id="@+id/post_show_share_image" android:layout_width="25dp" android:layout_height="25dp" android:layout_gravity="right" android:layout_marginRight="10dp" android:alpha="0.7" android:src="@drawable/abc_ic_menu_share_mtrl_alpha" /> <ImageView android:id="@+id/post_show_report_image" android:layout_width="25dp" android:layout_height="25dp" android:layout_gravity="right" android:layout_marginRight="10dp" android:alpha="0.7" android:padding="2dp" android:src="@drawable/post_report" /> </android.support.v7.widget.Toolbar> <RelativeLayout android:id="@+id/post_show_space" android:layout_width="fill_parent" android:layout_height="?attr/actionBarSize" android:layout_below="@+id/post_picture_image" android:visibility="gone" /> <ScrollView android:id="@+id/post_text_layout" style="@style/scrollbar_shape_style" android:layout_width="fill_parent" android:layout_height="140dp" android:layout_gravity="bottom" app:layout_collapseMode="parallax"> <RelativeLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:background="@color/category_text"> <com.tellfa.smsbox.components.tellfa_TextView_en android:id="@+id/post_text_text" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_marginBottom="2dp" android:layout_marginLeft="5dp" android:layout_marginRight="5dp" android:text="@string/connect_info" android:textColor="@color/top_user_bg" android:textSize="18sp" /> </RelativeLayout> </ScrollView> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout> </android.support.design.widget.CoordinatorLayout> </RelativeLayout> How to set ScrollView below in ImageView? TNX <3
266
The reason behind this is, you have to explicitly handle the motions or you may say the animations of all the views that are present on a particular page of your mobile application. So, in order to handle the views (especially the view that is having some motion) in a better way, Android introduced a new layout called the CoordinatorLayout.
And you have to use app:layout_anchorGravity to position the child. Do not use both of these together in any view. It may cause of unexpected result. app:layout_anchor: This attribute can be set on children of the CoordinatorLayout to attach them to another view.
Coordinator Layout is used to manage the transactions and animation of various views present in an Activity. Before Coordinator Layout, Frame Layout was used, but using more than one views in Frame Layout results in overlapping of views over one another. At the end of the blog, we did some examples to have a clear understanding.
RelativeLayout lets child views specify their position relative to the parent view or to each other (specified by ID). So you can align two elements by right border, or make one below another, centered in the screen, centered left, and so on.
I assume you are trying to position views inside of the CollapsingToolbarLayout. The CollapsingToolbarLayout extends FrameLayout, so the only possibility is to position views is to utilize view margin and gravity. In your case you could position a ImageView like:
<ImageView android:layout_width="match_parent" android:layout_height="100dp" android:layout_marginTop="140dp" <-height of the ScrollView /> If you are trying to add the new ImageView directly to the CoordinatorLayout you can utilize a anchor:
<ImageView android:layout_width="match_parent" android:layout_height="100dp" app:layout_anchor="@+id/post_text_layout" <-view to anchor the imageview app:layout_anchorGravity="bottom" <- specifies edge of the anchor that should be used android:layout_gravity="bottom" <- how to position this view relatively to the anchoring position /> If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
