Description:

web directional text field

a simple package to create a directionaly accurate text field in the web, as a fix for this issue.
Features #
this package implements WebTextField and WebTextFormField which behave simmilarly to the flutter ones.
the implementation uses the <input> html tag behind the scenes to give a real web experience.
Getting started #
before using any of the widgets, be sure to put the line
WebTextField.initialize();
copied to clipboard
in the main function!
Usage #
a simple example:
void main() {
WebTextField.initialize();
runApp(const MyApp());
}

class MyApp extends StatefulWidget {
const MyApp({Key? key}) : super(key: key);

@override
State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
String? currentValue;
TextEditingController controller = TextEditingController(text: "hello");
String? textError;
GlobalKey<FormState> key = GlobalKey();

@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: Scaffold(
body: Column(
children: [
const WebTextField(
decoration: InputDecoration(label: const Text("hey")),
initialValue: "initial value even for DirectionalTextField",
textDirection: TextFieldDirection.ltr,
),
WebTextFormField(
decoration: const InputDecoration(label: Text("hey")),
initialValue: "initial value",
),
const TextField(
decoration: InputDecoration(label: Text("hey")),
),
],
),
),
);
}
}

copied to clipboard

License

For personal and professional use. You cannot resell or redistribute these repositories in their original state.

Share

• Share on Facebook
• Share on Twitter