Develop Reference

Android data binding and included layout doesn't update visibility

Hi I have made layout with couple of ImageView and TextView elements due to reduction of code duplication.
I have occurred to two problems:
I need to update these elements inside of layout using data binding, but I don't know how can I access to them in order to update images and texts?
The visibility of layout should be bind from VM object(default visibility is GONE) but it doesn't work. Even if I update VM setter for visibility, the layout is till visible on the screen.
The code:
included layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/details"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#FF0000">
<ImageView
android:id="#+id/image_details"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/text_details"
android:text="details"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:id="#+id/favorites"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#00FF00">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:text="details"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:id="#+id/record"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#0000FF">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:text="details"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:id="#+id/remind_me"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#FF0000">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:text="details"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:id="#+id/return_to_begin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#00FF00">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:text="details"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
activity layout(this is a snippet, the whole xml is too large)
<include layout="#layout/manu_layout"
android:layout_above="#+id/info"
android:layout_alignParentRight="true"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:visibility="#{vm.infoMenu}"/>
viewModel method for visibility:
public void setInfoMenu() {
if(menuVisibility == View.VISIBLE){
menuVisibility = View.GONE;
setMediaControlView(false);
}else {
menuVisibility=View.VISIBLE;
setMediaControlView(true);
}
notifyPropertyChanged(BR.infoMenu);
}
#Bindable
public int getInfoMenu(){
return menuVisibility;
}
Please let me know if you need any additional code snippet.
Can you please help me to solve these problems?
Thanks,
Hogar

Make sure you have <layout> as a root tag of your xml file if you want to use DataBinding.
You can have a id of your <include> and acceess controls of included layout via it. For example you have a id as 'included' of your <include> then you can access it as binding.included.details or binding.included.favourite

updating design and support libs broke UI

currently we are using design and support libs 23.1.1 , when i updated to 25 there is a big gap in the layout and i can't figure out why
unfortunately i need more reputation to post links , all the links inside the file , sorry.
https://gist.github.com/xxqxpxx/a652a0c26a132913cd67faf21a670515
included files : build.gradle , layoutfile.xml , fragmentfile.xml , mainactivity ,activity1.
screenshot before :
screenshot after :

In your layout file change the root Linear layout height form match_parent to wrap_content
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mainLinearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="#dimen/authors_and_publishers_simpleDraweeView_margin_left"
android:orientation="vertical">
<com.facebook.drawee.view.SimpleDraweeView
android:id="#+id/authors_and_publishers_simpleDraweeView"
android:layout_width="#dimen/author_publishers_simpledraweeview"
android:layout_height="#dimen/author_publishers_simpledraweeview"
android:layout_gravity="center_horizontal" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/authors_publishers_name_layout_margin_top"
android:orientation="vertical">
<com.kotobi.widget.fonts.views.textviews.RobotoLight
android:id="#+id/authorName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:lines="1"
android:text="Name"
android:textSize="#dimen/author_publisher_pop_up_followrs_text_size" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/authors_and_publishers_simpleDraweeView_margin_top">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="#dimen/author_publisher_pop_up_image_dimen"
android:layout_height="#dimen/author_publisher_pop_up_image_dimen"
android:layout_gravity="center_vertical"
android:layout_marginRight="#dimen/author_publisher_pop_up_image_dimen_margin_right"
android:background="#drawable/followers" />
<com.kotobi.widget.fonts.views.textviews.RobotoLight
android:id="#+id/numberOfFollowers"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="12"
android:textColor="#color/grey"
android:textSize="#dimen/author_publisher_pop_up_followrs_number_books" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true">
<ImageView
android:layout_width="#dimen/author_publisher_pop_up_image_dimen"
android:layout_height="#dimen/author_publisher_pop_up_image_dimen"
android:layout_gravity="center_vertical"
android:layout_marginRight="#dimen/author_publisher_pop_up_image_dimen_margin_right"
android:background="#drawable/number_books" />
<com.kotobi.widget.fonts.views.textviews.RobotoLight
android:id="#+id/numberOfBooks"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="12"
android:textColor="#color/grey"
android:textSize="#dimen/author_publisher_pop_up_followrs_number_books" />
</LinearLayout>
</RelativeLayout>
</LinearLayout>
</LinearLayout>

How to move ImageButtons

I am working on an application for Android in Eclipse, but I have some problems with the look of the menu. I have several buttons that people can click and play sounds with them. The problem is that I don't know how to start a new line and go on with more buttons.
I'll post two images. I think the image title will tell you everything.
1st:
2nd:
The 2nd image is made with PhotoShop.
XML:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="665dp"
android:orientation="horizontal" >
<ImageButton
android:id="#+id/aatrox_imgbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/aatrox" />
<ImageButton
android:id="#+id/ahri_imgbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ahri" />
<ImageButton
android:id="#+id/akali_imgbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/akali" />
<ImageButton
android:id="#+id/alistar_imgbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/alistar" />
<ImageButton
android:id="#+id/amumu_imgbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/amumu" />
<ImageButton
android:id="#+id/anivia_imgbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/anivia" />
<ImageButton
android:id="#+id/annie_imgbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/annie" />
</LinearLayout>
</ScrollView>
<Button
android:id="#+id/back_champions"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="50dp"
android:text="#string/back" />
</LinearLayout>
I tried moving the image buttons with the mouse but no success.

you need grid view. check out sample
grid view sample

Tow centralized colomns GridView

I've created a gridlayout to put 4 images inside it and heres the xml :
<GridLayout
android:layout_width="match_parent"
android: layout_height="238dp"
android:columnCount="1"
android:useDefaultMargins="true"
tools:ignore="NewApi" >
<ImageView ... />
<ImageView ... />
<ImageView ... />
<ImageView ... />
</GridLayout>
So they've appeard like this :
and what i actually want is somthing like this :
And i don't want to use dp margin or padding because of the differences between devices resolutions.
So, How can i centralized those two colomns considering responsive design ?

Instead of using GridLayout I would suggest you do the following:
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal">
<ImageView
android:id="#+id/imgView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
<ImageView
android:id="#+id/imgView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/imgView1"
android:src="#drawable/ic_launcher" />
<ImageView
android:id="#+id/imgView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/imgView1"
android:src="#drawable/ic_launcher" />
<ImageView
android:id="#+id/imgView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/imgView2"
android:layout_toRightOf="#+id/imgView3"
android:src="#drawable/ic_launcher" />
</RelativeLayout>

How to create a Relative layout with multiple buttons compatible for all screen sizes?

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/lyt_parent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/plain_bg"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/lyt_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<include
android:layout_width="match_parent"
android:layout_height="wrap_content"
layout="#layout/header" />
</LinearLayout>
<LinearLayout
android:id="#+id/lyt_body"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/lyt_Buttons"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:id="#+id/imgfrontlogo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/imgcenterlogo"
android:layout_alignParentTop="true"
android:layout_marginTop="61dp"
android:background="#drawable/front_logo"
/>
<ImageView
android:id="#+id/imgcenterlogo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/btnPersonaltrainer"
android:layout_centerHorizontal="true"
android:layout_marginBottom="29dp"
android:background="#drawable/center_logo" />
<Button
android:id="#+id/btnMyProfile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_marginBottom="21dp"
android:layout_marginLeft="32dp"
android:background="#drawable/myprofile" />
<Button
android:id="#+id/btnTaracker"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/imgcenterlogo"
android:layout_alignParentRight="true"
android:layout_marginBottom="49dp"
android:background="#drawable/track" />
<Button
android:id="#+id/btnPersonaltrainer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/btnMyProfile"
android:layout_alignLeft="#+id/btnAllExercises"
android:background="#drawable/personaltrainer" />
<Button
android:id="#+id/btnRandomworkouts"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/btnPersonaltrainer"
android:layout_alignParentLeft="true"
android:background="#drawable/randomworkout" />
<Button
android:id="#+id/btnAllworkouts"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/btnAllExercises"
android:layout_alignBottom="#+id/btnAllExercises"
android:layout_alignLeft="#+id/btnMyProfile"
android:background="#drawable/allworkouts" />
<Button
android:id="#+id/btnAllExercises"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/btnTaracker"
android:layout_alignParentRight="true"
android:layout_marginRight="40dp"
android:background="#drawable/allexercises" />
</RelativeLayout>
</LinearLayout>
</LinearLayout>`
I need to create layout compatible for all screen sizes,created separte layout for xlarge sizes(800x1280,720x1280 etc). Here I cant upload image due to reputation,need to place one main button on center of the layout ,place 3 buttons on curvely on left and right side of middle button.please can anyone help me to create the layout compatible for all screen sizes without using dp or fixed points.

you can use android:layout_weight attribute. It will allow you to use percentages to define your buttons.
For EX:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:weightSum="1.0" >
<Button
android:text="left"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight=".50" />
<Button
android:text="right"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight=".50" />
</LinearLayout>
Now you have given percentages values to buttons so they will be displayed on any size of screen to their percent value of the whole screen.
This can be done in LinearLayout for RelativeLayout check second answer on this link

As mentioned in the question you want the buttons to be placed curvely at left and right of a center button, you can have a look at the link to get some idea to how to accomplish this: https://github.com/daCapricorn/ArcMenu
This is an open source project which I referred to create a Path like menu.