Not able to set width and height of FloatingActionButton dynamically by setLayoutParams

Question

I don't want to use normal or mini size of FAB. So, i'm trying to set width and height of a FAB by using LayoutParams but setLayoutParams is not working. I tried the same with ImageButton since FAB extends ImageButton and it worked for ImageButton. Can someone tell me why this is happening?

final GridLayout.LayoutParams lp = (GridLayout.LayoutParams) mFab1.getLayoutParams();
    ViewTreeObserver vto = mFab2.getViewTreeObserver();
    ViewTreeObserver.OnGlobalLayoutListener listener = new ViewTreeObserver.OnGlobalLayoutListener() {
        @Override
        public void onGlobalLayout() {
            lp.height = mFab2.getHeight();//Height is ready
            lp.width = mFab2.getWidth(); //Width is ready
            Log.d(LOG_TAG, (String.valueOf(mFab2.getWidth())) + " and " + (String.valueOf(mFab2.getHeight())));


        }
    } ;
    vto.addOnGlobalLayoutListener(listener);

    mFab1.setLayoutParams(lp);// Works here if mFab1 is ImageButton

    mFab1.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
        @Override
        public void onGlobalLayout() {

            Log.d(LOG_TAG, "Outside "+(String.valueOf(mFab1.getWidth())) + " and " + (String.valueOf(mFab1.getHeight())));
            if(mFab1.getWidth()==0){
                mFab1.setLayoutParams(lp);//trying to set LayoutParams again
                Log.d(LOG_TAG, "Inside "+(String.valueOf(mFab1.getWidth())) + " and " + (String.valueOf(mFab1.getHeight())));
            }

        }
    });

I'm using v7 GridLayout and in xml both height and width of mFab1 is set zero because I'm using weights. Since column span is 2 and layout_gravity is set as "center_horizontal" therefore, setting width to zero will not work that is why I want to set the width in the java code and it works very well for ImageButton.

    <android.support.v7.widget.GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    app:columnCount="2"
    app:rowCount="6"
    tools:context=".fragment.MainNavigationActivityFragment"
    >


<ImageButton
        android:id="@+id/mFab2"
        app:layout_rowWeight="1"
        app:layout_gravity="fill_horizontal"
        app:layout_columnSpan="1"
        app:layout_columnWeight="1"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:src="@drawable/ic_home"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"
        android:background="@drawable/home_bg"
        android:layout_marginTop="10dp"
        android:layout_marginLeft="10dp"/>

<ImageButton
    app:layout_rowWeight="1"
    android:id="@+id/mFab3"
    app:layout_columnSpan="1"
    app:layout_gravity="fill_horizontal"
    app:layout_columnWeight="1"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/ic_home"
    android:background="@drawable/home_bg"
    android:layout_marginTop="10dp"
    android:layout_marginRight="10dp"
    android:layout_marginLeft="10dp" />

<Button
    app:layout_rowSpan="1"
    app:layout_rowWeight="0.2"
    app:layout_gravity="fill_horizontal"
    app:layout_columnSpan="1"
    app:layout_columnWeight="1"
    android:id="@+id/button1"
    android:text="Some Text"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:background="@color/transparent"
    android:textColor="@color/colorPrimary"
    android:fontFamily="roboto-condensed"
    android:layout_marginTop="10dp"
    android:layout_marginLeft="10dp" />
<Button
    app:layout_rowSpan="1"
    app:layout_rowWeight="0.2"
    app:layout_gravity="fill_horizontal"
    app:layout_columnSpan="1"
    app:layout_columnWeight="1"
    android:id="@+id/button2"
    android:text="Some Text"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:fontFamily="roboto-condensed"
    android:textColor="@color/colorPrimary"
    android:background="@color/transparent"
    android:layout_marginTop="10dp"
    android:layout_marginLeft="10dp" />



<ImageButton
    app:layout_rowWeight="1"
    android:id="@+id/mFab3"
    android:textColor="#FFFFFF"
    android:textSize="30sp"
    app:layout_columnSpan="1"
    app:layout_gravity="fill_horizontal"
    app:layout_columnWeight="1"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/ic_home"
    android:background="@drawable/home_bg"
    android:padding="10dp"
    android:layout_marginLeft="10dp"
    android:layout_marginTop="10dp" />

<ImageButton
    app:layout_rowWeight="1"
    android:id="@+id/mFab4"
    app:layout_columnSpan="1"
    app:layout_gravity="fill_horizontal"
    app:layout_columnWeight="1"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/ic_home"
    android:background="@drawable/home_bg"
    android:layout_marginTop="10dp"
    android:layout_marginRight="10dp"
    android:layout_marginLeft="10dp" />

<Button
    app:layout_rowSpan="1"
    app:layout_rowWeight="0.2"
    app:layout_gravity="fill_horizontal"
    app:layout_columnSpan="1"
    app:layout_columnWeight="1"
    android:id="@+id/button3"
    android:text="Some Text"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:background="@color/transparent"
    android:textColor="@color/colorPrimary"
    android:fontFamily="roboto-condensed"
    android:layout_marginLeft="10dp"
    android:layout_marginTop="10dp" />
<Button
    app:layout_rowSpan="1"
    app:layout_rowWeight="0.2"
    app:layout_gravity="fill_horizontal"
    app:layout_columnSpan="1"
    app:layout_columnWeight="1"
    android:id="@+id/button4"
    android:text="Some Text"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:fontFamily="roboto-condensed"
    android:textColor="@color/colorPrimary"
    android:background="@color/transparent"
    android:layout_marginTop="10dp"
    android:layout_marginRight="10dp"
    android:layout_marginLeft="10dp" />

 <android.support.design.widget.FloatingActionButton
        app:layout_rowSpan="1"
        app:layout_rowWeight="1"
        android:id="@+id/mFab1"
        app:layout_columnSpan="2"
        app:layout_gravity="center_horizontal"
        app:layout_columnWeight="1"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"
        app:backgroundTint="@color/colorPrimary"
        android:src="@drawable/icon"
        android:layout_margin="10dp"
        android:layout_marginTop="10dp"
        android:layout_marginRight="10dp"
        android:layout_marginBottom="10dp"
         />

<Button
    app:layout_rowSpan="1"
    app:layout_rowWeight="0.2"
    app:layout_gravity="center_horizontal"
    app:layout_columnSpan="2"
    app:layout_columnWeight="1"
    android:id="@+id/button5"
    android:text="Some Text"
    android:layout_width="wrap_content"
    android:layout_height="0dp"
    android:fontFamily="roboto-condensed"
    android:textColor="@color/colorPrimary"
    android:background="@color/transparent"
    android:layout_margin="10dp"
    android:layout_marginTop="10dp"
    android:layout_marginRight="10dp"
    android:layout_marginBottom="10dp" />
</android.support.v7.widget.GridLayout>

share the code that you tried. – guipivoto Feb 11 '16 at 20:20 — guipivoto, Feb 11 '16 at 20:20
@GuilhermeP Did you saw the code?? – anubh Feb 12 '16 at 12:11 — anubh, Feb 12 '16 at 12:11
Could you please share the resouce file of mFab2 as well? – guipivoto Feb 12 '16 at 13:14 — guipivoto, Feb 12 '16 at 13:14

guipivoto · Answer 1 · 2016-02-12T13:36:23.073

0

I think I could understand what you want to do.

It seems that you want to set mFab1 height/width according to height/width from mFab2. Is that right?

I think you just need to add a listener to mFab2. So, when height/width from mFab2 are readdy, you apply them to mFab1. You don't need to set a listener to mFab1.

Could you please try below code:

    findViewById(R.id.mFab2).getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
        @Override
        public void onGlobalLayout() {
            View mFab1 = findViewById(R.id.mFab1);
            View mFab2 = findViewById(R.id.mFab2);
            mFab1.getLayoutParams().height = mFab2.getHeight();
            mFab1.getLayoutParams().width = mFab2.getWidth();
            Log.d(LOG_TAG, (String.valueOf(mFab2.getWidth())) + " and " + (String.valueOf(mFab2.getHeight())));
        }
    });

You can replace all the code that you shared in the description by this one. Then, let me know if works.

Of course, if that code works, you can add proper null checks and any other error checking

edited Feb 12 '16 at 13:36

answered Feb 12 '16 at 13:28

guipivoto

18,327
9
60
75

Yes, you got what I want to do. The code you wrote was the first thing I did. All other code I wrote after I was unable do it this way. But I don't know why this code is not able to set width of FAB. I'm not sure, but I think there is some thing which stops us from dynamically setting height and width of a FAB. – anubh Feb 12 '16 at 21:03
In the logs, which width and height are printed? I tested the code above and it was working. Did you tried the exactly code I shared? – guipivoto Feb 12 '16 at 21:12
In logs of your code you are just printing width and height of mFab2 which is already been set. Try printing the width of mFab1, the one we have to set. It is always zero. – anubh Feb 12 '16 at 21:18
But for me, its working. mFab1 is resized with same height/width of mFab2 :( – guipivoto Feb 12 '16 at 21:21
Can there be any other problem? Because it is not working for me but if I do the same for Image button it works. – anubh Feb 12 '16 at 21:23
Is width and height of your mFab1 is same? Can that be a problem? Because my width and height might differ. One of thing I also noticed is that when I'm using FAB and try to set width in XML code then also it's not working. – anubh Feb 12 '16 at 21:28
Is it possible share whole activity and layout code? I'll try to simulate you code here. Not the project... Needed code only – guipivoto Feb 12 '16 at 21:30
I shared the rest of xml code because I think there is some problem over here only. You can check that but now I'm using ImageButton for every FAB for now. You can try changing the width of mFab1 but will not work even in xml. And if you replace that with a ImageButton it works. – anubh Feb 12 '16 at 21:56
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/103339/discussion-between-guilherme-p-and-anubh). – guipivoto Feb 12 '16 at 22:00

Not able to set width and height of FloatingActionButton dynamically by setLayoutParams

1 Answers1