Created
August 2, 2022 02:43
-
-
Save kenyk7/5059604a4fbdf04f67fcc68cd02f987a to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import 'package:flutter/material.dart'; | |
import 'package:rxdart/rxdart.dart'; | |
class AppBloc extends StatelessWidget { | |
@override | |
Widget build(BuildContext context) { | |
return MaterialApp( | |
darkTheme: ThemeData.dark(), | |
theme: ThemeData.light(), | |
home: const HomePage(), | |
debugShowCheckedModeBanner: false, | |
); | |
} | |
} | |
class HomePage extends StatefulWidget { | |
const HomePage(); | |
@override | |
State<HomePage> createState() => _HomePageState(); | |
} | |
class _HomePageState extends State<HomePage> { | |
@override | |
void dispose() { | |
myBloc.dispose(); | |
super.dispose(); | |
} | |
@override | |
Widget build(BuildContext context) { | |
return Scaffold( | |
appBar: AppBar( | |
title: Text('Flutter Bloc'), | |
), | |
body: Padding( | |
padding: const EdgeInsets.all(20.0), | |
child: Center( | |
child: StreamBuilder<PasswordField>( | |
stream: myBloc.passwordForm, | |
builder: (_, snapshot) { | |
final isShow = snapshot.data?.showPassword ?? false; | |
return TextField( | |
onChanged: myBloc.changePassword, | |
obscureText: isShow, | |
decoration: InputDecoration( | |
label: Text('Password'), | |
suffixIcon: IconButton( | |
onPressed: myBloc.toggleShowPassword, | |
icon: Icon( | |
isShow ? Icons.abc : Icons.remove_red_eye_outlined, | |
), | |
), | |
), | |
); | |
}, | |
), | |
), | |
), | |
floatingActionButton: StreamBuilder<bool>( | |
stream: myBloc.showPassword, | |
builder: (_, snapshot) { | |
final isShow = snapshot.data ?? false; | |
return FloatingActionButton( | |
onPressed: () { | |
myBloc.toggleShowPassword(); | |
}, | |
child: Icon( | |
isShow ? Icons.abc : Icons.remove_red_eye_outlined, | |
), | |
); | |
}, | |
), | |
); | |
} | |
} | |
// model | |
class PasswordField { | |
PasswordField({ | |
required this.password, | |
required this.showPassword, | |
}); | |
final String password; | |
final bool showPassword; | |
} | |
// bloc | |
class MyBloC { | |
bool _showPassword = false; | |
final _passwordCtrl = BehaviorSubject<String>(); | |
Stream<String> get password => _passwordCtrl.stream; | |
final _showPasswordCtrl = BehaviorSubject<bool>()..add(false); | |
Stream<bool> get showPassword => _showPasswordCtrl.stream; | |
// use cambine 2 types | |
Stream<PasswordField> get passwordForm => Rx.combineLatest2( | |
password, | |
showPassword, | |
(String a, bool b) => PasswordField( | |
password: a, | |
showPassword: b, | |
), | |
); | |
void changePassword(String val) { | |
print(val); | |
_passwordCtrl.sink.add(val); | |
} | |
void toggleShowPassword() { | |
_showPassword = !_showPassword; | |
_showPasswordCtrl.sink.add(_showPassword); | |
} | |
void dispose() { | |
_passwordCtrl.close(); | |
_showPasswordCtrl.close(); | |
} | |
} | |
final myBloc = MyBloC(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment