首页 > 解决方案 > How to use Visibility to hide some elements in Flutter

问题描述

I am trying to use Visibility in Flutter to hide some elements from my app. What I'm trying to do now:

I have multiple options in floatingActionButton: SpeedDial. I also have a condition that I want to check. If the condition is met, some options are hidden in floatingActionButton: SpeedDial.

The condition is as follows:

bool visibilityController = false;

@override
void initState() {
  super.initState();
  setState(() {
    if(_myPreferences.id ==(UserPostID)){
      visibilityController = true;
    }

  });
}

So if it is true user can see all options and if false some options will be hidden. But now I try to make SpeedDialChild like this:

child: Visibility(
  visible: visibilityController,
  SpeedDialChild(
    child: Icon(Icons.message),
    backgroundColor:  const Color(0xFFf6c626),
    label: 'Comments',
    onTap: () { }
  ),
)

When trying to do the packaging like that, I get an error. So how can I hide some options from floatingActionButton: SpeedDial?

import 'package:flutter/material.dart';
import 'package:flutter_speed_dial/flutter_speed_dial.dart';

import 'fg.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  bool visibilityController = false;

  @override
  void initState() {
    super.initState();
    setState(() {
      if(_myPreferences.id ==(UserPostID)){
        visibilityController = false;
      }

    });
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(

            floatingActionButton: SpeedDial(
              animatedIcon: AnimatedIcons.menu_close,
              animatedIconTheme: IconThemeData(size: 22.0),


              curve: Curves.bounceIn,
              overlayColor: Colors.black,
              overlayOpacity: 0.5,
              onOpen: () => print('OPENING DIAL'),
              onClose: () => print('DIAL CLOSED'),
              tooltip: 'Speed Dial',
              heroTag: 'speed-dial-hero-tag',
              backgroundColor:  const Color(0xFFf6c626),
              foregroundColor: Colors.black,
              elevation: 8.0,
              shape: CircleBorder(),
              children: [
                SpeedDialChild(
                    child: Icon(Icons.message),
                    backgroundColor:  const Color(0xFFf6c626),
                    label: 'Comments',
                    onTap: () { }
                ),
                SpeedDialChild(
                    child: Icon(Icons.account_circle),
                    backgroundColor:  const Color(0xFFf6c626),
                    label: 'About user',
                    onTap: () {  }
                ),

              ],
            ),

    );
  }
}

标签: flutterdart

解决方案


推荐阅读