4

So I'm creating a flutter for web application. A little risky but I really just want an initial prototype, and hopefully by the time I need something production ready it's in at least beta.

Anyways, I'm trying to create a login page, and I can't actually enter anything into the TextFiled.

I've tried adding/removing the TextEdditingController and the input decoration. I've tried a TextField and a TextFormField as well

Widget loginWidget() {
    return Container(
      width: 650,
      child: Card(
        margin: EdgeInsets.all(5.0),
        color: UiColors.CardBlue,
        child: Column(
          mainAxisSize: MainAxisSize.min,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            Row(
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                MaterialButton(
                  minWidth: 300,
                  color: UiColors.CardBlue,
                  child: Text("Login", style: TextStyle(color: Colors.white),),
                  onPressed: (){}, // do nothing, this is already the login
                ),
                MaterialButton(
                  minWidth: 300,
                  elevation: 10,
                  color: UiColors.ButtonBlue,
                  child: Text("Register", style: TextStyle(color: Colors.white),),
                  onPressed: toggleLogin,
                )
              ],
            ),
            TextField(
              controller: usernameController,
              decoration: InputDecoration(
                border: InputBorder.none,
                labelText: "Email Address",
                hintText: "user@email.com"
              ),
            )
          ],
        ),
      ),
    );
  }

EDIT: This only seems to effect firefox, works in chrome

4

3 回答 3

3

In the github repo of flutter_web, it says

"The development workflow is only designed to work with Chrome at the moment." https://github.com/flutter/flutter_web

At this time, it looks like your prototype development is limited to a chrome browser.

于 2019-07-14T02:24:39.670 回答
0

I Know it is late but I will answer this for the use of others. Flutter is currently in process of completing its framework for web. So, the fact that the TextField is not working is due to the version of flutter_web. Therefore I recommend you to use older issues from github in your pubspec.yaml file like below:

name: newweb
description: An app built using Flutter for web

environment:
  # You must be using Flutter >=1.5.0 or Dart >=2.3.0
  sdk: '>=2.3.0-dev.0.1 <3.0.0'

dependencies:
  flutter_web: any
  flutter_web_ui: any
  provider: any
  rxdart: ^0.22.0
  http: ^0.12.0+2
  json_annotation: ^2.4.0
  intl: 0.15.8
  firebase: any


dev_dependencies:
  build_runner: ^1.4.0
  build_web_compilers: ^2.0.0
  pedantic: ^1.0.0
  json_serializable: ^3.0.0
  test: any

flutter:
  uses-material-design: true

dependency_overrides:
  flutter_web:
    git:
      ref: cc38319
      url: https://github.com/flutter/flutter_web
      path: packages/flutter_web
  flutter_web_ui:
    git:
      url: https://github.com/flutter/flutter_web
      path: packages/flutter_web_ui
  provider:
    git:
      url: https://github.com/kevmoo/provider
      ref: flutter_web
于 2020-01-02T16:41:42.640 回答
0

I tried all the solutions but couldn't fix it. Whatever I was typing in TextField or TextFormField or autocomplete_textfield, the characters were not visible.

I fixed it by opening the Widget as a showGeneralDialog() instead of using Navigator.of(...). Here is the sample code.

await showGeneralDialog(
    barrierColor: AppStyle.primaryColor.withOpacity(0.3),
    transitionBuilder: (context, a1, a2, widget) {
      return Transform.scale(
        scale: a1.value,
        child: Opacity(opacity: a1.value, child: WidgetScreenToOpen()),
      );
    },
    transitionDuration: Duration(milliseconds: 500),
    barrierDismissible: true,
    barrierLabel: 'Label',
    context: context,
    pageBuilder: (context, animation1, animation2) {
      return Container();
    }).then((result) {
  return result;
});
于 2021-02-24T08:15:41.647 回答