fix tablet and font size

merge-requests/1/merge
Elham Rababah 6 years ago
parent 23b8c93201
commit 76c83b86fa

@ -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,7 +9,18 @@ class AuthHeader extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
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>[
@ -14,51 +28,73 @@ class AuthHeader extends StatelessWidget {
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Container(
margin:
EdgeInsetsDirectional.fromSTEB(0, 50, 0, 0),
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,
),
),
SizedBox(
height: 10,
),
Text(
Container(
margin: isSmallScreen?null:EdgeInsetsDirectional.fromSTEB(constraints.maxWidth*0.13, 0, 0, 0),
child: Text(
"LOGIN",
style: TextStyle(
fontSize: 30, fontWeight: FontWeight.w800),
style: TextStyle(fontSize: isSmallScreen?30:constraints.maxWidth*0.035, fontWeight: FontWeight.w800),
),
)
],
),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
children: isSmallScreen?<Widget>[
SizedBox(
height: 10,
),
Text(
"Welcome to",
style: TextStyle(fontSize: 24),
style: TextStyle(fontSize: isSmallScreen?24:constraints.maxWidth*0.029),
),
Text(
'Dr Sulaiman Al Habib',
style: TextStyle(
fontSize: 24,
fontSize: isSmallScreen?24:constraints.maxWidth*0.029,
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(
"Doctor App",
'Dr Sulaiman Al Habib',
style: TextStyle(
fontSize: 26,
color: Theme.of(context).primaryColor),
)
fontSize: isSmallScreen?24:constraints.maxWidth*0.029,
color: Theme.of(context).primaryColor,
),
),
],
),Container(
margin: isSmallScreen?null:EdgeInsetsDirectional.fromSTEB(constraints.maxWidth*0.13, 0, 0, 0),
child: Text(
"Doctor App",
style: TextStyle(
fontSize: isSmallScreen?26:constraints.maxWidth*0.030, color: Theme.of(context).primaryColor),
),
)],
)
],
),
);
));
return screen;
});
}
}

@ -1,4 +1,5 @@
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:hexcolor/hexcolor.dart';
class LoginForm extends StatelessWidget {
@ -8,8 +9,13 @@ class LoginForm extends StatelessWidget {
@override
Widget build(BuildContext context) {
return LayoutBuilder(builder: (ctx, constraints) {
var smallScreenSize = 660;
bool isSmallScreen = constraints.maxWidth<=smallScreenSize;
return Container(
width: 320,
width: constraints.maxWidth * 0.9,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
@ -20,13 +26,15 @@ class LoginForm extends StatelessWidget {
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),
borderSide:
BorderSide(color: Theme.of(context).primaryColor),
)
//BorderRadius.all(Radius.circular(20));
),
@ -44,13 +52,15 @@ class LoginForm extends StatelessWidget {
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),
borderSide:
BorderSide(color: Theme.of(context).primaryColor),
)
//BorderRadius.all(Radius.circular(20));
),
@ -68,13 +78,15 @@ class LoginForm extends StatelessWidget {
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),
borderSide:
BorderSide(color: Theme.of(context).primaryColor),
)
//BorderRadius.all(Radius.circular(20));
),
@ -99,7 +111,7 @@ class LoginForm extends StatelessWidget {
value: true,
activeColor: Theme.of(context).primaryColor,
onChanged: (bool newValue) {}),
Text("Remember me", style: TextStyle(fontSize: 16)),
Text("Remember me", style: TextStyle(fontSize:isSmallScreen?18:constraints.maxWidth*0.018)),
],
),
),
@ -118,7 +130,7 @@ class LoginForm extends StatelessWidget {
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
const Text('LOG IN', style: TextStyle(fontSize: 20)),
Text('LOG IN', style: TextStyle(fontSize:isSmallScreen?20:constraints.maxWidth*0.020)),
Image.asset('assets/images/login_btn_arrow_icon.png')
],
),
@ -129,5 +141,6 @@ class LoginForm extends StatelessWidget {
],
),
);
});
}
}

@ -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

@ -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

Loading…
Cancel
Save