Skip to content

Instantly share code, notes, and snippets.

@junjizhi
Created June 16, 2019 15:03
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save junjizhi/0dcc0b5b78e417fcf96ac2200264ef03 to your computer and use it in GitHub Desktop.
Save junjizhi/0dcc0b5b78e417fcf96ac2200264ef03 to your computer and use it in GitHub Desktop.
iOS style clickable card demo
import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Clickable Card',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
MyHomePage({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: CupertinoButton(
child: Container(
height: 200,
width: 200,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage("assets/mindful.jpg"),
fit: BoxFit.cover,
),
borderRadius: BorderRadius.circular(12),
),
child: Container(
margin: EdgeInsets.fromLTRB(15, 15, 0, 0),
child: Text(
"Mindfulness",
style: TextStyle(
color: Colors.white,
fontSize: 20,
fontWeight: FontWeight.w600),
),
),
),
onPressed: () {
showCupertinoDialog(
context: context,
builder: (BuildContext context) => CupertinoAlertDialog(
title: const Text('Card is clicked.'),
actions: <Widget>[
CupertinoDialogAction(
child: const Text('ok'),
onPressed: () {
Navigator.pop(context, 'ok');
},
),
],
),
);
},
),
),
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment