shalini
shalini

Reputation: 2375

Hide Text Widget visibility in Flutter on the click of button

I want to hide a text widget visibility on the click of a button using Visibility widget. How can I achieve this in Flutter? I have created a function which accepts a bool variable which defines the visibility of the Text Widget. On the click of the button, I am calling that function. For the first time, the text is shown to the user. But on the click of the button, the text is not invisible.

//created a method to show and hide the text using visibility widget
hideTextVisibility(bool visibilityStatus){
return visibilityStatus? Visibility(
visible: visibilityStatus,
child: Text("flutter"),

):Container();}



//button click code and for the first time the text will be visible 
RaisedButton(onPressed: (){
setState(() {
hideTextVisibility(false);
});

Upvotes: 7

Views: 14075

Answers (2)

Alan John
Alan John

Reputation: 777

Step 1:

bool _visible = false;

Step 2:

void _toggle() {
    setState(() {
      _visible = !_visible;
    });
  }

Step 3: Add on your RaisedButton or any other button

onPressed: _toggle,

Step 4: Code your widget like this.

Gone: The widget doesn't take any physical space and is completely gone.

Visibility(
  child: Text("Gone"),
  visible: _visible,
),

Invisible: The widget takes physical space on the screen but not visible to user.

Visibility(
  child: Text("Invisible"),
  maintainSize: true, 
  maintainAnimation: true,
  maintainState: true,
  visible: _visible, 
),

Upvotes: 18

Govaadiyo
Govaadiyo

Reputation: 6082

You are passing hardcode false to the button's method hideTextVisibility(false); just change here hideTextVisibility(visibilityStatus);

Upvotes: 2

Related Questions