Skip to content

Instantly share code, notes, and snippets.

@abulka
Created July 19, 2021 03:46
Show Gist options
  • Save abulka/5b207c8287b946deace31d8c5e85edea to your computer and use it in GitHub Desktop.
Save abulka/5b207c8287b946deace31d8c5e85edea to your computer and use it in GitHub Desktop.
My SO answer to replicating an android layout
import 'package:flutter/material.dart';
// My answer to
// https://stackoverflow.com/questions/61443845/how-to-replicate-this-specific-android-constraint-layout-on-flutter
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Replicate Android Layout',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('Replicate Android Layout')),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
IntrinsicWidth(
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
_getPublisherLogoImage(),
FittedBox(
fit: BoxFit.fitWidth, child: _getNewsItemHour(context)),
],
),
),
_getNewsItemQuotation(context),
],
),
),
);
}
}
Widget _getPublisherLogoImage() {
return Image(
image: NetworkImage(
'https://flutter.github.io/assets-for-api-docs/assets/widgets/owl.jpg'),
width: 200,
);
}
Widget _getNewsItemHour(BuildContext context) {
return Padding(
padding: EdgeInsets.only(top: 10),
child: Text('09.35',
style: TextStyle(
color: Theme.of(context).primaryColor,
fontWeight: FontWeight.normal)));
}
Widget _getNewsItemQuotation(BuildContext context) {
double width = MediaQuery.of(context).size.width;
double _price = 60.59;
return Text(
'\$$_price',
style: TextStyle(
fontSize: width * 0.25,
color: Colors.grey,
),
);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment