Haroon6138
/
doctor_app_flutter
1
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

fix tablet and font size

Browse Source
merge-requests/1/merge
Elham Rababah 5 years ago
parent 23b8c93201
commit 76c83b86fa
4 changed files with 220 additions and 164 deletions
Show Stats Download Patch File Download Diff File

130
lib/widgets/auth/auth_header.dart
Unescape Escape View File

@ -1,4 +1,7 @@
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter_device_type/flutter_device_type.dart';
class AuthHeader extends StatelessWidget {
const AuthHeader({
Key key,
@ -6,59 +9,92 @@ class AuthHeader extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Container(
margin:
EdgeInsetsDirectional.fromSTEB(0, 50, 0, 0),
child: Image.asset(
'assets/images/login_icon.png',
fit: BoxFit.cover,
),
),
SizedBox(
height: 10,
print(Device.get().isPhone);
print(Device.get().isAndroid);
print(Device.get().isIos);
var smallScreenSize = 660;
return LayoutBuilder(builder: (ctx, constraints) {
bool isSmallScreen = constraints.maxWidth<=smallScreenSize;
var screen = Container(
margin: isSmallScreen?null:EdgeInsetsDirectional.fromSTEB(constraints.maxWidth*0.30, constraints.maxWidth*0.1, 0, 0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Container(
margin: isSmallScreen?EdgeInsetsDirectional.fromSTEB(0, 50, 0, 0):EdgeInsetsDirectional.fromSTEB(constraints.maxWidth*0.13, 0, 0, 0),
child: Image.asset(
'assets/images/login_icon.png',
fit: BoxFit.cover,
height: isSmallScreen?null: constraints.maxWidth*0.09,
),
Text(
),
SizedBox(
height: 10,
),
Container(
margin: isSmallScreen?null:EdgeInsetsDirectional.fromSTEB(constraints.maxWidth*0.13, 0, 0, 0),
child: Text(
"LOGIN",
style: TextStyle(
fontSize: 30, fontWeight: FontWeight.w800),
)
],
),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
SizedBox(
height: 10,
style: TextStyle(fontSize: isSmallScreen?30:constraints.maxWidth*0.035, fontWeight: FontWeight.w800),
),
Text(
"Welcome to",
style: TextStyle(fontSize: 24),
)
],
),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: isSmallScreen?<Widget>[
SizedBox(
height: 10,
),
Text(
"Welcome to",
style: TextStyle(fontSize: isSmallScreen?24:constraints.maxWidth*0.029),
),
Text(
'Dr Sulaiman Al Habib',
style: TextStyle(
fontSize: isSmallScreen?24:constraints.maxWidth*0.029,
color: Theme.of(context).primaryColor,
),
Text(
'Dr Sulaiman Al Habib',
style: TextStyle(
fontSize: 24,
color: Theme.of(context).primaryColor,
),
),
]:<Widget>[SizedBox(
height: 10,
),Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Text(
"Welcome to ",
style: TextStyle(fontSize: isSmallScreen?24:constraints.maxWidth*0.029),
),
Text(
'Dr Sulaiman Al Habib',
style: TextStyle(
fontSize: isSmallScreen?24:constraints.maxWidth*0.029,
color: Theme.of(context).primaryColor,
),
Text(
),
],
),Container(
margin: isSmallScreen?null:EdgeInsetsDirectional.fromSTEB(constraints.maxWidth*0.13, 0, 0, 0),
child: Text(
"Doctor App",
style: TextStyle(
fontSize: 26,
color: Theme.of(context).primaryColor),
)
],
)
],
),
);
fontSize: isSmallScreen?26:constraints.maxWidth*0.030, color: Theme.of(context).primaryColor),
),
)],
)
],
));
return screen;
});
}
}

245
lib/widgets/auth/login_form.dart
Unescape Escape View File

@ -1,4 +1,5 @@
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:hexcolor/hexcolor.dart';
class LoginForm extends StatelessWidget {
@ -8,126 +9,138 @@ class LoginForm extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
width: 320,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
SizedBox(
height: 20,
),
TextFormField(
decoration: InputDecoration(
prefixIcon: Image.asset('assets/images/user_id_icon.png'),
hintText: 'Enter ID',
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(20)),
borderSide: BorderSide(color: Hexcolor('#CCCCCC')),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(10.0)),
borderSide: BorderSide(color: Theme.of(context).primaryColor),
)
//BorderRadius.all(Radius.circular(20));
),
validator: (value) {
if (value.isEmpty) {
return 'Please enter some text';
}
return null;
},
),
SizedBox(
height: 20,
),
TextFormField(
decoration: InputDecoration(
prefixIcon: Image.asset('assets/images/password_icon.png'),
hintText: 'Enter Password',
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(20)),
borderSide: BorderSide(color: Hexcolor('#CCCCCC')),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(10.0)),
borderSide: BorderSide(color: Theme.of(context).primaryColor),
)
//BorderRadius.all(Radius.circular(20));
),
validator: (value) {
if (value.isEmpty) {
return 'Please enter some text';
}
return null;
},
),
SizedBox(
height: 20,
),
TextFormField(
decoration: InputDecoration(
prefixIcon: Image.asset('assets/images/hospital_icon.png'),
hintText: 'Select Project',
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(20)),
borderSide: BorderSide(color: Hexcolor('#CCCCCC')),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(10.0)),
borderSide: BorderSide(color: Theme.of(context).primaryColor),
)
//BorderRadius.all(Radius.circular(20));
),
validator: (value) {
if (value.isEmpty) {
return 'Please enter some text';
}
return null;
},
),
SizedBox(
height: 20,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Container(
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Checkbox(
value: true,
activeColor: Theme.of(context).primaryColor,
onChanged: (bool newValue) {}),
Text("Remember me", style: TextStyle(fontSize: 16)),
],
),
),
RaisedButton(
onPressed: () {},
textColor: Colors.white,
elevation: 0.0,
padding: const EdgeInsets.all(0.0),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10),
side: BorderSide(width:0.5,color: Hexcolor('#CCCCCC'))),
child: Container(
padding: const EdgeInsets.all(10.0),
height: 50,
width: 140,
return LayoutBuilder(builder: (ctx, constraints) {
var smallScreenSize = 660;
bool isSmallScreen = constraints.maxWidth<=smallScreenSize;
return Container(
width: constraints.maxWidth * 0.9,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
SizedBox(
height: 20,
),
TextFormField(
decoration: InputDecoration(
prefixIcon: Image.asset('assets/images/user_id_icon.png'),
hintText: 'Enter ID',
hintStyle: TextStyle(fontSize:isSmallScreen?24:constraints.maxWidth*0.024) ,
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(20)),
borderSide: BorderSide(color: Hexcolor('#CCCCCC')),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(10.0)),
borderSide:
BorderSide(color: Theme.of(context).primaryColor),
)
//BorderRadius.all(Radius.circular(20));
),
validator: (value) {
if (value.isEmpty) {
return 'Please enter some text';
}
return null;
},
),
SizedBox(
height: 20,
),
TextFormField(
decoration: InputDecoration(
prefixIcon: Image.asset('assets/images/password_icon.png'),
hintText: 'Enter Password',
hintStyle: TextStyle(fontSize:isSmallScreen?24:constraints.maxWidth*0.024) ,
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(20)),
borderSide: BorderSide(color: Hexcolor('#CCCCCC')),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(10.0)),
borderSide:
BorderSide(color: Theme.of(context).primaryColor),
)
//BorderRadius.all(Radius.circular(20));
),
validator: (value) {
if (value.isEmpty) {
return 'Please enter some text';
}
return null;
},
),
SizedBox(
height: 20,
),
TextFormField(
decoration: InputDecoration(
prefixIcon: Image.asset('assets/images/hospital_icon.png'),
hintText: 'Select Project',
hintStyle: TextStyle(fontSize:isSmallScreen?24:constraints.maxWidth*0.024) ,
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(20)),
borderSide: BorderSide(color: Hexcolor('#CCCCCC')),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(10.0)),
borderSide:
BorderSide(color: Theme.of(context).primaryColor),
)
//BorderRadius.all(Radius.circular(20));
),
validator: (value) {
if (value.isEmpty) {
return 'Please enter some text';
}
return null;
},
),
SizedBox(
height: 20,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Container(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
const Text('LOG IN', style: TextStyle(fontSize: 20)),
Image.asset('assets/images/login_btn_arrow_icon.png')
Checkbox(
value: true,
activeColor: Theme.of(context).primaryColor,
onChanged: (bool newValue) {}),
Text("Remember me", style: TextStyle(fontSize:isSmallScreen?18:constraints.maxWidth*0.018)),
],
),
),
)
],
),
],
),
);
RaisedButton(
onPressed: () {},
textColor: Colors.white,
elevation: 0.0,
padding: const EdgeInsets.all(0.0),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10),
side: BorderSide(width: 0.5, color: Hexcolor('#CCCCCC'))),
child: Container(
padding: const EdgeInsets.all(10.0),
height: 50,
width: 140,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Text('LOG IN', style: TextStyle(fontSize:isSmallScreen?20:constraints.maxWidth*0.020)),
Image.asset('assets/images/login_btn_arrow_icon.png')
],
),
),
)
],
),
],
),
);
});
}
}

7
pubspec.lock
Unescape Escape View File

@ -69,6 +69,13 @@ packages:
description: flutter
source: sdk
version: "0.0.0"
flutter_device_type:
dependency: "direct main"
description:
name: flutter_device_type
url: "https://pub.dartlang.org"
source: hosted
version: "0.2.0"
flutter_test:
dependency: "direct dev"
description: flutter

2
pubspec.yaml
Unescape Escape View File

@ -20,7 +20,7 @@ dependencies:
flutter:
sdk: flutter
hexcolor: ^1.0.1
flutter_device_type: ^0.2.0
# The following adds the Cupertino Icons font to your application.
# Use with the CupertinoIcons class for iOS style icons.
cupertino_icons: ^0.1.2

Write Preview
Loading…
Cancel
Save