Skip to content

Instantly share code, notes, and snippets.

@ajaybeniwal

ajaybeniwal/main.dart

Created January 2, 2019 17:05
Show Gist options
  • Star 5 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save ajaybeniwal/1c32a5ee7cb8460a367a458429a265b8 to your computer and use it in GitHub Desktop.
Save ajaybeniwal/1c32a5ee7cb8460a367a458429a265b8 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
main.dart
import 'package:flutter/material.dart';
import 'create_connection.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter App',
theme: ThemeData(
primarySwatch: Colors.blue,
),
initialRoute: '/',
routes: {
'/': (context) => MyHomePage(),
'/create': (context) => CrateConnection(),
},
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int getColorHexFromStr(String colorStr) {
colorStr = "FF" + colorStr;
colorStr = colorStr.replaceAll("#", "");
int val = 0;
int len = colorStr.length;
for (int i = 0; i < len; i++) {
int hexDigit = colorStr.codeUnitAt(i);
if (hexDigit >= 48 && hexDigit <= 57) {
val += (hexDigit - 48) * (1 << (4 * (len - 1 - i)));
} else if (hexDigit >= 65 && hexDigit <= 70) {
// A..F
val += (hexDigit - 55) * (1 << (4 * (len - 1 - i)));
} else if (hexDigit >= 97 && hexDigit <= 102) {
// a..f
val += (hexDigit - 87) * (1 << (4 * (len - 1 - i)));
} else {
throw new FormatException("An error occurred when converting a color");
}
}
return val;
}
@override
Widget build(BuildContext context) {
return Scaffold(
bottomNavigationBar: BottomAppBar(
shape: CircularNotchedRectangle(),
notchMargin: 4.0,
child: new Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
IconButton(icon: Icon(Icons.home), color: Colors.blue, onPressed: () {},),
IconButton(icon: Icon(Icons.person), onPressed: () {},color: Colors.blue),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (BuildContext context) => CrateConnection(),
));
},
tooltip: 'Add Connection',
child: Icon(Icons.add),
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
// floatingActionButton: FancyFab(),
appBar: PreferredSize(
child: AppBar(
backgroundColor: Color(getColorHexFromStr('#FDD148')),
elevation: 0.0,
),
preferredSize: Size.fromHeight(0.0)),
body: ListView(
children: <Widget>[
Column(children: <Widget>[
Stack(children: <Widget>[
Container(
height: 180.0,
color: Color(getColorHexFromStr('#FDD148')),
),
Column(crossAxisAlignment: CrossAxisAlignment.start, children: <
Widget>[
SizedBox(height: 15.0),
Padding(
padding: EdgeInsets.only(left: 15.0),
child: Text(
'Hello, Ajay',
style: TextStyle(
fontSize: 30.0, fontWeight: FontWeight.bold),
),
),
SizedBox(height: 15.0),
Padding(
padding: const EdgeInsets.only(left: 15.0),
child: Text(
'Provider you would like to connect?',
style: TextStyle(
fontSize: 23.0, fontWeight: FontWeight.bold),
),
),
SizedBox(height: 25.0),
Padding(
padding: EdgeInsets.only(left: 15.0, right: 15.0),
child: Material(
elevation: 5.0,
borderRadius: BorderRadius.circular(8.0),
child: Container(
height: 75.0,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8.0),
color: Colors.white),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
Container(
height: 75.0,
width: MediaQuery.of(context).size.width / 4,
child: Column(
children: <Widget>[
Container(
height: 50.0,
width: 50.0,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage(
'assets/google.png'))),
),
Text(
'Google',
)
],
),
),
Container(
height: 75.0,
width: MediaQuery.of(context).size.width / 4,
child: Column(
children: <Widget>[
Container(
height: 50.0,
width: 50.0,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage(
'assets/windows.png'))),
),
Text(
'Microsoft',
)
],
),
),
Container(
height: 75.0,
width: MediaQuery.of(context).size.width / 3,
child: Column(
children: <Widget>[
Container(
height: 50.0,
width: 50.0,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage(
'assets/amazon.png'))),
),
Text(
'Amazon',
)
],
),
),
])),
),
),
]),
]),
]),
SizedBox(
height: 20,
),
Padding(
padding: const EdgeInsets.only(left: 16.0, right: 16.0),
child: Container(
child: Text("All Connections",
style: TextStyle(
fontSize: 23.0,
fontWeight: FontWeight.bold,
color: Colors.black87))),
),
Padding(
padding:
const EdgeInsets.symmetric(horizontal: 0, vertical: 12.0),
child: Container(
height: 100,
child: ListView(
scrollDirection: Axis.horizontal,
children: <Widget>[
numberCard("13", "Connected"),
numberCard("5", "Queued"),
numberCard("7", "Deleted"),
numberCard("14", "Pending"),
],
),
),
),
SizedBox(
height: 10,
),
Padding(
padding: const EdgeInsets.only(left: 16.0, right: 16.0),
child: Container(
child: Text("Recent Connections",
style: TextStyle(
fontSize: 23.0,
fontWeight: FontWeight.bold,
color: Colors.black87))),
),
SizedBox(
height: 20,
),
itemCard('Google Cloud', 'assets/slack.png', "Pending Approval"),
itemCard(
'AWS Direct Connect', 'assets/windows.png', "Pending Approval"),
Padding(
padding: const EdgeInsets.only(top: 16.0, bottom: 16.0, left:16.0, right: 16.0),
child: Text("Frequently Connected To",
style: TextStyle(fontSize: 23.0, fontWeight: FontWeight.bold)),
),
Padding(
padding: const EdgeInsets.only(bottom: 16.0),
child: Container(
height: 185,
child: ListView(
scrollDirection: Axis.horizontal,
padding: EdgeInsets.symmetric(horizontal: 8.0),
children: <Widget>[
frequentCard("assets/amazon.png", "Amzon Web Services"),
frequentCard("assets/google.png", "Google Cloud"),
frequentCard("assets/windows.png", "Microsoft Azure")
],
),
),
)
],
));
}
Widget frequentCard(String asset, String title) {
return Container(
height: 185,
width: 200,
margin: EdgeInsets.symmetric(horizontal: 8.0),
decoration: BoxDecoration(
border: Border.all(color: Color(getColorHexFromStr('#e4e4e4'))),
borderRadius: BorderRadius.circular(8.0)),
child: Column(children: <Widget>[
Padding(
padding: const EdgeInsets.symmetric(vertical: 8.0),
child: Image.asset(
asset,
height: 40.0,
),
),
Text(title,
style:
TextStyle(color: Colors.black87, fontWeight: FontWeight.bold)),
SizedBox(
height: 10,
),
Container(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: Column(children: <Widget>[
Text("2",
style: TextStyle(
color: Colors.black87, fontWeight: FontWeight.bold)),
Text("Services",
style: TextStyle(
color: Colors.black38, fontWeight: FontWeight.w400)),
]),
),
Container(
height: 30.0,
width: 1.0,
color: Color(getColorHexFromStr('#e4e4e4'))),
Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
children: <Widget>[
Text("2",
style: TextStyle(
color: Colors.black87,
fontWeight: FontWeight.bold)),
Text("Locations",
style: TextStyle(
color: Colors.black38,
fontWeight: FontWeight.w400)),
],
),
)
],
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Container(
height: 30,
decoration: BoxDecoration(
border: Border.all(color: Color(getColorHexFromStr('#009aff'))),
borderRadius: BorderRadius.circular(16.0)),
child: Center(
child: Text("Connect",
style:
TextStyle(color: Color(getColorHexFromStr('#009aff')))),
),
),
)
]),
);
}
Widget numberCard(String number, String title) {
return Container(
width: 120,
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Material(
elevation: 2.0,
borderRadius: BorderRadius.circular(4.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Container(
child: Text(number,
overflow: TextOverflow.ellipsis,
style: TextStyle(
fontSize: 18.0,
fontWeight: FontWeight.bold,
color: Colors.black38))),
Container(
margin: const EdgeInsets.only(top: 10),
child: Text(
title,
overflow: TextOverflow.clip,
maxLines: 1,
)),
],
)),
));
}
Widget itemCard(String title, String imgPath, String description) {
return Padding(
padding: EdgeInsets.only(
left: 15.0,
right: 15.0,
),
child: Card(
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(children: <Widget>[
Expanded(
child: Padding(
padding: const EdgeInsets.only(left: 8.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
padding: const EdgeInsets.only(top: 8.0, bottom: 4.0),
child: Text(
title,
style: TextStyle(
fontWeight: FontWeight.bold, fontSize: 18.0),
),
),
Text(
description,
style: TextStyle(
color: Colors.grey[500],
),
),
],
),
),
)
]),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(children: <Widget>[
Container(
child: Row(children: <Widget>[
Image.asset("assets/server.png"),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text("California"),
Text("Origin"),
],
)
]),
),
Expanded(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 8.0),
child: Column(
children: <Widget>[
Container(
height: 6.0,
color: Colors.blue,
)
],
),
),
),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
Padding(
padding: const EdgeInsets.only(right: 8.0),
child: Container(
child: Row(children: <Widget>[
Image.asset("assets/cloud.png"),
Padding(
padding: const EdgeInsets.only(left: 8.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text("Google Direct"),
Text("Destination"),
],
),
)
]),
),
),
],
)
]),
),
ButtonTheme.bar(
// make buttons use the appropriate styles for cards
child: ButtonBar(
children: <Widget>[
FlatButton(
child: const Text('ACCEPT'),
onPressed: () {/* ... */},
),
FlatButton(
child: const Text('DELETE'),
onPressed: () {/* ... */},
),
],
),
),
],
),
),
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment