【问题标题】:How to pass a string from one page to another on flutter?如何在颤动中将字符串从一个页面传递到另一个页面?
【发布时间】:2020-06-01 15:31:34
【问题描述】:

如何将 image_category(a String value) 从一个页面传递到另一个页面并将其替换为 Text 小部件?

这是我从 (scrlView) 获取字符串的地方:-

@override
Widget build(BuildContext context) {
return Padding(
  padding: const EdgeInsets.all(0.0),
  child: GestureDetector(
    onTap: () {
      print("$image_category"); //TODOPass tpped text to CatagoriesBar, 
    },

这是我想用文本小部件替换它的地方(这是在单独的页面上CategoriesBar):-

import 'package:flutter/material.dart';

 class CategoriesBar extends StatefulWidget {
 @override
 _CategoriesBarState createState() => _CategoriesBarState();
  }

 class _CategoriesBarState extends State<CategoriesBar> {
  @override
  Widget build(BuildContext context) {
   return  Align(
        alignment: Alignment.center,
        child: Text(
          "All Categories",//TODOReplace with category tapped on scrlView
          style: TextStyle(
            color: Colors.black,
            fontSize: 17.0,
            fontWeight: FontWeight.bold,
          ),
        ),
      );
    }

我是个扑腾的新手, 道歉。如果细节不够(请在 cmets 中告诉我,我会更新问题)

更新

我试过Navigator.push,它会弹出一个带有“image_category”的新黑屏。

这是我尝试过的:-scrlView

@override
 Widget build(BuildContext context) {
 return Padding(
 padding: const EdgeInsets.all(0.0),
 child: GestureDetector(
onTap: () {
  print("$image_category");
   Navigator.push(
                context,
               MaterialPageRoute(
                    builder: (context) => CategoriesBar (categoryTitle: image_caption),
                )
            );
},

这是我尝试过的:-CategoriesBar

import 'package:flutter/material.dart';

class CategoriesBar extends StatefulWidget {
final String categoryTitle;
CategoriesBar({Key key, @required this.categoryTitle}) : super(key: key);
@override
_CategoriesBarState createState() => _CategoriesBarState();
}

class _CategoriesBarState extends State<CategoriesBar> {
 @override
 Widget build(BuildContext context) {
 return  Align(
    alignment: Alignment.center,
    child: Text(
      widget.categoryTitle,
      style: TextStyle(
        color: Colors.red,
        fontSize: 17.0,
        fontWeight: FontWeight.bold,
      ),
    ),
  );
}

这就是我得到的:-

【问题讨论】:

  • CategoriesBar 小部件是如何调用的?你能显示那个代码吗?

标签: flutter dart


【解决方案1】:
@override
Widget build(BuildContext context) {
    return Padding(
        padding: const EdgeInsets.all(0.0),
        child: GestureDetector(
            onTap: () {
                print("$image_category"); 

                Navigator.push(
                    context,
                    MaterialPageRoute(
                        builder: (context) => CategoriesBar (text: image_category),
                    )
                );
            },
        … 
        )
    )
}

然后:

import 'package:flutter/material.dart';

class CategoriesBar extends StatefulWidget {
    final String text;
    CategoriesBar ({Key key, @required this.text}) : super(key: key);
    @override
    _CategoriesBarState createState() => _CategoriesBarState();
}

class _CategoriesBarState extends State<CategoriesBar> {
    @override
    Widget build(BuildContext context) {
        return  Align(
            alignment: Alignment.center,
            child: Text(
                widget.text,
                style: TextStyle(
                    color: Colors.black,
                    fontSize: 17.0,
                    fontWeight: FontWeight.bold,
                ),
            ),
        );
    }
}

更多信息Passing data between screens in Flutter

更新

您应该将内容包装在 Scaffold 视图中。

import 'package:flutter/material.dart';

class CategoriesBar extends StatefulWidget {
final String categoryTitle;
CategoriesBar({Key key, @required this.categoryTitle}) : super(key: key);
@override
_CategoriesBarState createState() => _CategoriesBarState();
}

class _CategoriesBarState extends State<CategoriesBar> {
 @override
 Widget build(BuildContext context) {
  return Scaffold(
        appBar: AppBar(
         title: Text("APPBAR"),
       ), 
  body: Align(
    alignment: Alignment.center,
    child: Text(
      widget.categoryTitle,
      style: TextStyle(
        color: Colors.red,
        fontSize: 17.0,
        fontWeight: FontWeight.bold,
      ),
    ),
  ),
 );
}

请确保相应地关闭括号。我在没有任何代码编辑器的情况下打字。 Vs 代码为您提供了很好的格式化和错误处理能力。

【讨论】:

  • 嘿,@ShiftMora 我已经尝试过您的回答并相应地更新了问题,请您看一下!
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2010-11-30
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多