6
votes

I need some help with ConstraintLayout.

I have 3 Buttons vertically aligned. Button1 and Button3 are visible, Button2 is invisible. When I click on Button1, Button2 should be visible.

<Button
    android:id="@+id/button1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="8dp"
    android:onClick="on_expand"
    android:text="Button"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/textView" />

<Button
    android:id="@+id/button2"
    android:layout_width="wrap_content"
    android:layout_height="0dp"
    android:layout_marginTop="8dp"
    android:text="Button"
    android:visibility="invisible"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/button1" />

<Button
    android:id="@+id/button3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="8dp"
    android:text="Button"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@id/button1" />

How can I set

app:layout_constraintTop_toBottomOf="@id/button2"

on Button3

I have found this

Button b1 = (Button)findViewById(R.id.button1);
Button b2 = (Button) findViewById(R.id.button2);
Button b3 = (Button) findViewById(R.id.button3);    

ConstraintSet constraintSet = new ConstraintSet();
        constraintSet.connect("What must i set here????");
        constraintSet.clone(mConstraintLayout);
        constraintSet.applyTo(mConstraintLayout);
1

1 Answers

11
votes

First add:

android:id="@+id/constraint_layout"

to your ConstraintLayout, then change:

android:onClick="on_expand"

in:

android:onClick="onExpand"

to respect lowerCamelCase methods naming convention.

Finally this should be your code:

public class MainActivity extends AppCompatActivity {

private ConstraintLayout mConstraintLayout;
private Button mButton;
private ConstraintSet mConstraintSet = new ConstraintSet();

@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    mConstraintLayout = findViewById(R.id.constraint_layout);
    mButton = findViewById(R.id.button2);
}

public void onExpand(View view) {
    // If the button is already visible then you don't need to apply any constraints
    if (mButton.getVisibility() == View.VISIBLE) {
        return;
    }
    /* Otherwise:
    - Make the button2 visible;
    - Insert the actual constraints in the ConstraintSet
    - Define a new constraint between button3 and button2 (TopToBottomOf)
    - Apply it to the ConstraintLayout */
    mButton.setVisibility(View.VISIBLE);
    mConstraintSet.clone(mConstraintLayout);
    mConstraintSet.connect(R.id.button3, ConstraintSet.TOP, 
                           R.id.button2, ConstraintSet.BOTTOM);
    mConstraintSet.applyTo(mConstraintLayout);
    }
}