标签: flutter-widget

我尝试将Hero小部件与ChangeNotifierProvider新的导航 2.0 系统一起使用。但我在那里面临着问题。相同的代码在不使用时有效。changeNotifier

我面临的问题是，弹出第二页 W2 后，第一页中的文本（即英雄的孩子）消失了。

下面是完整的代码。runApp(HeroTestApp2())正常工作。但我很想让第一种方法发挥作用。请帮忙。

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

main(List<String> args) {
  runApp(HeroTestApp());
}

class MyModel extends ChangeNotifier {
  bool _go = false;
  bool get go => _go;
  set go(bool go) {
    _go = go;
    notifyListeners();
  }
}

class HeroTestApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider<MyModel>(
      create: (context) => MyModel(),
      builder: (context, _) {
        final state = context.watch<MyModel>();
        return MaterialApp(
          home: Navigator(
            pages: [
              MaterialPage(child: W1(onTapped: …

我正在尝试创建一个通用的消费者小部件，以方便其子视图模型。因此，我有两个功能。一个在初始化ViewModel之后具有功能（T），另一个用于将模型传递给其子Widget。

泛型类中的子元素是ChangeNotifier的子元素，在我要在两个函数中发送T值之前，它都可以正常工作。

然后我得到以下错误：

类型'（OnBoardingViewModel）=> Null'不是类型'（ChangeNotifier）=> void'的子类型

和

类型'（BuildContext，OnBoardingViewModel，Widget）=>脚手架'不是类型'（BuildContext，ChangeNotifier，Widget）=> Widget'的子类型

但是，当我将扩展类型从ChangeNotifier更改为OnBoardingViewModel时，一切正常。

有人可以帮助我，或解释为什么这不起作用吗？

import 'package:flutter/material.dart';
import 'package:get_it/get_it.dart';
import 'package:provider/provider.dart';

class StateFullConsumerWidget<T extends ChangeNotifier> extends StatefulWidget{

  StateFullConsumerWidget({@required this.builder,Key key,this.onPostViewModelInit,this.child}) : super(key : key);

  final Widget Function(BuildContext context, ChangeNotifier value, Widget child) builder;
  final Widget child;

  final void Function(T) onPostViewModelInit;

  @override
  _StateFullConsumerWidgetState<T> createState() => _StateFullConsumerWidgetState<T>();
}

class _StateFullConsumerWidgetState<T extends ChangeNotifier> extends State<StateFullConsumerWidget>{
  T _viewModel;
  @override
  void initState() {
    // assign the model once when state is initialised
    _viewModel = GetIt.instance.get<T>();
    widget.onPostViewModelInit(_viewModel);


    super.initState();
  }
  @override …

我是颤振的新手。现在正在学习如何定位或对齐小部件。我的行小部件中有两个容器。我想在左上角设置我的第一个容器（红色容器），还想在右上角设置我的第二个容器（蓝色容器）。我怎样才能做到这一点？

这是代码示例：

class MyRow extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        backgroundColor: Colors.teal,
        body: SafeArea(
          child: Row(
            children: <Widget>[
              Container(
                width: 100.0,
                height: 100.0,
                color: Colors.red,
              ),
              Container(
                width: 100.0,
                height: 100.0,
                color: Colors.blue,
              ),
            ],
          ),
        ),
      ),
    );
  }
}

我是新来的颤振和尝试的东西。

我用一个中心小部件替换了脚手架小部件（只是乱搞）。所有文本都有一个黄色下划线，为了克服这个我用TextDecoration

Text(
    friend.name,
    style: TextStyle(
        decoration: TextDecoration.none
    ),
));

但这对于所有 Text 小部件都是必需的，因此我尝试通过在根 MaterialApp 中设置 Theme 数据来为所有 Text 小部件通用设置它。

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp( 
      title: 'Friends List',
      theme: ThemeData(
        primaryColor: Colors.black,
        primarySwatch: Colors.teal,
        primaryTextTheme: TextTheme(
          headline1: TextStyle(color: Colors.green, decoration: TextDecoration.none),
         headline2: TextStyle(color: Colors.green, decoration: TextDecoration.none),
         headline3: TextStyle(color: Colors.green, decoration: TextDecoration.none),
         headline4: TextStyle(color: Colors.green, decoration: TextDecoration.none),
         headline5: TextStyle(color: Colors.green, decoration: TextDecoration.none),
         headline6: TextStyle(color: Colors.green, …

目前正在探索functional_widgets 和flutter_hooks。对 reactjs 有同样的想法，我正在使用以下代码获取数据。

@hwidget
Widget homeScreen(BuildContext context) {
  TodoListProvider model = Provider.of<TodoListProvider>(context);
  useEffect(() {
    print('effect');
    model.fetchList();
    return () => {};
  }, []);
  return Scaffold(
    appBar: _buildAppbar(context, model),
    bottomNavigationBar: _buildBottomNav(context, model),
    floatingActionButton: _buildFloatingAction(context),
    body: PageTransitionSwitcher(
      duration: const Duration(milliseconds: 300),
      reverse: model.reverse,
      transitionBuilder: (
        Widget child,
        Animation<double> animation,
        Animation<double> secondaryAnimation,
      ) {
        return SharedAxisTransition(
          child: child,
          animation: animation,
          secondaryAnimation: secondaryAnimation,
          transitionType: SharedAxisTransitionType.horizontal,
        );
      },
      child: _getCurrentTab(model.currentIndex),
    ),
  );
}

我不认为这是正确的方法，因为它会引发错误。

有一种ContinuousRectangleBorder油漆，我可以将其传递给Card或Material小部件的形状参数。

Material(
  shape: ContinuousRectangleBorder(
    borderRadius: BorderRadius.circular(50),
  ),
  elevation: 4,
  color: theme.primaryColor,
  child: image,
  borderOnForeground: true,
)

但是在 android 中，如果我将图像传递给小部件，则图像不会作为父级剪辑。裁剪具有相同形状的图像的最佳方法是什么？

如何在颤振中从 ExpansionTile 中删除这条灰线？

代码

ExpansionTile(
          title: Text(
            "Title",
            style: TextStyle(
              fontSize: 18.0,
              fontWeight: FontWeight.bold
            ),
          ),
          children: <Widget>[
            ListTile(
              title: Text(
                'data'
              ),
            )
          ],
        ),

我有一个带有 2 个小部件/页面的 flutter 应用程序，即：
- 加载小部件/页面（在应用程序启动时立即出现）
- 主页小部件/页面

我想在加载页面完成加载后启动主页。基本上我的问题是 -我如何知道我的小部件何时完成加载？

以下是我的代码：

// My main.dart
import 'package:flutter/material.dart';
import 'package:routes/pages/home.dart';
import 'package:routes/pages/loading.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,
      ),
      routes: {
        '/': (context) => Loading(),
        '/home': (context) => Home(),
      },
    );
  }
}

class Loading extends StatefulWidget {
  @override …

我正在尝试使图像的圆角。这是我的代码：

                   ClipRRect(
                        borderRadius: BorderRadius.circular(14),
                        child: Image.asset(
                          "assets/images/test.png"                         
                        ))

一切正常，但是当我尝试将图像放入具有固定高度和宽度的容器中时，圆形边框停止工作。这是我的代码：

         LimitedBox(
              maxWidth: 95,
              maxHeight: 95,
              child: ClipRRect(
                    borderRadius: BorderRadius.circular(14),
                    child: Image.asset(
                      "assets/images/test.png"                        
                    ),
              ),
            )

为什么会出现这种情况，请帮帮我。

Flutter 在使用 RTL（从右到左）TextField 时存在错误。如果我们点击（A），光标将停在B处，即文本末尾的前一个，并且我们无法编辑最后一个字符！我创建了这个问题，希望 Flutter 人们能够看到它并修复它