Mr.Rahmani
/
didvan-app
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

authentication screens layout

This commit is contained in:
MohammadTaha Basiri 2021-12-11 10:32:44 +03:30
parent fc0745abfe
commit 9b49dc5f1a
4 changed files with 191 additions and 199 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

78
lib/pages/authentication/screens/password.dart
View File

@ -1,9 +1,8 @@
import 'package:didvan/pages/authentication/authentication_state.dart'; import 'package:didvan/pages/authentication/authentication_state.dart';
import 'package:didvan/pages/authentication/widgets/authentication_app_bar.dart'; import 'package:didvan/pages/authentication/widgets/authentication_layout.dart';
import 'package:didvan/widgets/didvan/button.dart'; import 'package:didvan/widgets/didvan/button.dart';
import 'package:didvan/widgets/didvan/text.dart'; import 'package:didvan/widgets/didvan/text.dart';
import 'package:didvan/widgets/didvan/text_field.dart'; import 'package:didvan/widgets/didvan/text_field.dart';
import 'package:didvan/widgets/logos/didvan_horizontal_logo.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
@ -13,53 +12,36 @@ class PasswordInput extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final AuthenticationState state = context.read<AuthenticationState>(); final AuthenticationState state = context.read<AuthenticationState>();
return SingleChildScrollView( return AuthenticationLayout(
padding: const EdgeInsets.symmetric(horizontal: 20), appBarTitle: 'ورود با شماره موبایل ' + state.phoneNumber,
child: SizedBox( children: [
height: MediaQuery.of(context).size.height, DidvanTextField(
child: Column( onChanged: (value) => state.password = value,
children: [ autoFocus: true,
AuthenticationAppBar( title: 'کلمه عبور',
title: 'ورود با شماره موبایل ' + state.phoneNumber, hintText: 'کلمه عبور',
), obsecureText: true,
const Padding(
padding: EdgeInsets.only(
bottom: 44,
top: 34,
left: 100,
right: 100,
),
child: DidvanVerticalLogo(),
),
DidvanTextField(
onChanged: (value) => state.password = value,
autoFocus: true,
title: 'کلمه عبور',
hintText: 'کلمه عبور',
obsecureText: true,
),
const SizedBox(
height: 32,
),
GestureDetector(
onTap: () => state.currentPageIndex++,
child: DidvanText(
'فراموشی رمز عبور',
style: Theme.of(context).textTheme.subtitle2,
color: Theme.of(context).primaryColor,
),
),
const Spacer(),
DidvanButton(
onPressed: () {},
title: 'ورود',
),
const SizedBox(
height: 48,
),
],
), ),
), const SizedBox(
height: 32,
),
GestureDetector(
onTap: () => state.currentPageIndex++,
child: DidvanText(
'فراموشی رمز عبور',
style: Theme.of(context).textTheme.subtitle2,
color: Theme.of(context).primaryColor,
),
),
const Spacer(),
DidvanButton(
onPressed: () {},
title: 'ورود',
),
const SizedBox(
height: 48,
),
],
); );
} }
} }

138
lib/pages/authentication/screens/phone_number.dart
View File

@ -1,7 +1,7 @@
import 'package:didvan/pages/authentication/authentication_state.dart'; import 'package:didvan/pages/authentication/authentication_state.dart';
import 'package:didvan/pages/authentication/widgets/authentication_layout.dart';
import 'package:didvan/widgets/didvan/button.dart'; import 'package:didvan/widgets/didvan/button.dart';
import 'package:didvan/widgets/didvan/text_field.dart'; import 'package:didvan/widgets/didvan/text_field.dart';
import 'package:didvan/widgets/logos/didvan_horizontal_logo.dart';
import 'package:flutter/gestures.dart'; import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
@ -14,83 +14,67 @@ class PhoneNumberInput extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final AuthenticationState state = context.read<AuthenticationState>(); final AuthenticationState state = context.read<AuthenticationState>();
return SingleChildScrollView( return AuthenticationLayout(
physics: const NeverScrollableScrollPhysics(), children: [
padding: const EdgeInsets.all(20), DidvanTextField(
child: SizedBox( title: 'شماره موبایل',
height: MediaQuery.of(context).size.height, textInputType: TextInputType.phone,
child: Column( hintText: 'شماره موبایل',
children: [ textAlign: TextAlign.center,
const Padding( onChanged: (value) {
padding: EdgeInsets.only( state.phoneNumber = value;
top: 80, },
left: 100,
right: 100,
bottom: 40,
),
child: DidvanVerticalLogo(),
),
DidvanTextField(
title: 'شماره موبایل',
textInputType: TextInputType.phone,
hintText: 'شماره موبایل',
textAlign: TextAlign.center,
onChanged: (value) {
state.phoneNumber = value;
},
),
const SizedBox(
height: 20,
),
DidvanButton(
title: 'ورود',
onPressed: () {
state.currentPageIndex = 1;
},
),
const Spacer(),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 60),
child: RichText(
textAlign: TextAlign.center,
text: TextSpan(
style: Theme.of(context).textTheme.caption,
children: [
const TextSpan(text: 'با ثبت نام و ورود به دیدوان،'),
TextSpan(
text: ' شرایط ',
style: Theme.of(context)
.textTheme
.caption!
.copyWith(color: Theme.of(context).primaryColor),
recognizer: TapGestureRecognizer()
..onTap = () {
//TODO: Needs implementaion
},
),
const TextSpan(text: 'و\n'),
TextSpan(
text: ' قوانین حریم خصوصی ',
style: Theme.of(context)
.textTheme
.caption!
.copyWith(color: Theme.of(context).primaryColor),
recognizer: TapGestureRecognizer()
..onTap = () {
//TODO: Needs implementaion
},
),
const TextSpan(text: 'را می‌پذیرم'),
],
),
),
),
const SizedBox(
height: 48,
),
],
), ),
), const SizedBox(
height: 20,
),
DidvanButton(
title: 'ورود',
onPressed: () {
state.currentPageIndex = 1;
},
),
const Spacer(),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 60),
child: RichText(
textAlign: TextAlign.center,
text: TextSpan(
style: Theme.of(context).textTheme.caption,
children: [
const TextSpan(text: 'با ثبت نام و ورود به دیدوان،'),
TextSpan(
text: ' شرایط ',
style: Theme.of(context)
.textTheme
.caption!
.copyWith(color: Theme.of(context).primaryColor),
recognizer: TapGestureRecognizer()
..onTap = () {
//TODO: Needs implementaion
},
),
const TextSpan(text: 'و\n'),
TextSpan(
text: ' قوانین حریم خصوصی ',
style: Theme.of(context)
.textTheme
.caption!
.copyWith(color: Theme.of(context).primaryColor),
recognizer: TapGestureRecognizer()
..onTap = () {
//TODO: Needs implementaion
},
),
const TextSpan(text: 'را می‌پذیرم'),
],
),
),
),
const SizedBox(
height: 48,
),
],
); );
} }
} }

129
lib/pages/authentication/screens/verification.dart
View File

@ -1,9 +1,8 @@
import 'package:didvan/config/design_config.dart'; import 'package:didvan/config/design_config.dart';
import 'package:didvan/pages/authentication/authentication_state.dart'; import 'package:didvan/pages/authentication/authentication_state.dart';
import 'package:didvan/pages/authentication/widgets/authentication_app_bar.dart'; import 'package:didvan/pages/authentication/widgets/authentication_layout.dart';
import 'package:didvan/widgets/didvan/button.dart'; import 'package:didvan/widgets/didvan/button.dart';
import 'package:didvan/widgets/didvan/text.dart'; import 'package:didvan/widgets/didvan/text.dart';
import 'package:didvan/widgets/logos/didvan_horizontal_logo.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:pin_code_fields/pin_code_fields.dart'; import 'package:pin_code_fields/pin_code_fields.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
@ -14,79 +13,61 @@ class Verification extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final AuthenticationState state = context.read<AuthenticationState>(); final AuthenticationState state = context.read<AuthenticationState>();
return SingleChildScrollView( return AuthenticationLayout(
physics: const NeverScrollableScrollPhysics(), appBarTitle: 'تغییر رمز عبور',
padding: const EdgeInsets.symmetric(horizontal: 20), children: [
child: SizedBox( DidvanText(
height: MediaQuery.of(context).size.height, 'کد 6 رقممی ارسال شده به موبایل',
child: Column( style: Theme.of(context).textTheme.subtitle2,
children: [ fontWeight: FontWeight.normal,
const AuthenticationAppBar(
title: 'تغییر رمز عبور',
),
const Padding(
padding: EdgeInsets.only(
bottom: 24,
top: 34,
left: 100,
right: 100,
),
child: DidvanVerticalLogo(),
),
DidvanText(
'کد 6 رقممی ارسال شده به موبایل',
style: Theme.of(context).textTheme.subtitle2,
fontWeight: FontWeight.normal,
),
const SizedBox(
height: 8,
),
DidvanText(
state.phoneNumber,
style: Theme.of(context).textTheme.subtitle1,
),
const SizedBox(
height: 8,
),
DidvanText(
'را وارد کنید:',
style: Theme.of(context).textTheme.subtitle2,
fontWeight: FontWeight.normal,
),
const SizedBox(
height: 24,
),
Directionality(
textDirection: TextDirection.ltr,
child: PinCodeTextField(
keyboardType: TextInputType.number,
animationType: AnimationType.scale,
pinTheme: PinTheme(
fieldHeight: 48,
fieldWidth: 48,
inactiveColor: DesignConfig.greyColor4,
activeFillColor: Theme.of(context).primaryColorLight,
activeColor: Theme.of(context).primaryColor,
borderRadius: DesignConfig.lowBorderRadius,
borderWidth: 1,
shape: PinCodeFieldShape.box,
),
appContext: context,
length: 6,
onChanged: (value) => state.verificationCode = value,
),
),
const Spacer(),
DidvanButton(
onPressed: () {},
title: 'تایید',
),
const SizedBox(
height: 48,
),
],
), ),
), const SizedBox(
height: 8,
),
DidvanText(
state.phoneNumber,
style: Theme.of(context).textTheme.subtitle1,
),
const SizedBox(
height: 8,
),
DidvanText(
'را وارد کنید:',
style: Theme.of(context).textTheme.subtitle2,
fontWeight: FontWeight.normal,
),
const SizedBox(
height: 24,
),
Directionality(
textDirection: TextDirection.ltr,
child: PinCodeTextField(
keyboardType: TextInputType.number,
animationType: AnimationType.scale,
pinTheme: PinTheme(
fieldHeight: 48,
fieldWidth: 48,
inactiveColor: DesignConfig.greyColor4,
activeFillColor: Theme.of(context).primaryColorLight,
activeColor: Theme.of(context).primaryColor,
borderRadius: DesignConfig.lowBorderRadius,
borderWidth: 1,
shape: PinCodeFieldShape.box,
),
appContext: context,
length: 6,
onChanged: (value) => state.verificationCode = value,
),
),
const Spacer(),
DidvanButton(
onPressed: () {},
title: 'تایید',
),
const SizedBox(
height: 48,
),
],
); );
} }
} }

45
lib/pages/authentication/widgets/authentication_layout.dart Normal file
View File

@ -0,0 +1,45 @@
import 'package:didvan/pages/authentication/widgets/authentication_app_bar.dart';
import 'package:didvan/widgets/logos/didvan_horizontal_logo.dart';
import 'package:flutter/material.dart';
class AuthenticationLayout extends StatelessWidget {
final List<Widget> children;
final String? appBarTitle;
const AuthenticationLayout(
{Key? key, required this.children, this.appBarTitle})
: super(key: key);
@override
Widget build(BuildContext context) {
return SingleChildScrollView(
padding: const EdgeInsets.symmetric(horizontal: 20),
physics: const NeverScrollableScrollPhysics(),
child: SizedBox(
height: MediaQuery.of(context).size.height,
child: Column(
children: [
if (appBarTitle != null)
AuthenticationAppBar(
title: appBarTitle,
),
if (appBarTitle == null)
const SizedBox(
height: 66,
),
const Padding(
padding: EdgeInsets.only(
top: 44,
left: 100,
right: 100,
bottom: 40,
),
child: DidvanVerticalLogo(),
),
...children,
],
),
),
);
}
}