Added content screen

This commit is contained in:
Moe Poi ~ 2021-08-16 17:42:41 +07:00
parent 8994ee0470
commit d94914bfcd
10 changed files with 134 additions and 0 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 109 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 156 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 144 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 158 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 108 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 205 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 97 KiB

View file

@ -0,0 +1,76 @@
import 'package:easy_learn/view/widgets/list_contents_box.dart';
import 'package:easy_learn/view/widgets/score_board.dart';
import 'package:flutter/material.dart';
import 'package:easy_learn/view/widgets/custom_button.dart';
class Content extends StatefulWidget {
const Content({Key? key, required this.category}) : super(key: key);
final String category;
@override
_ContentState createState() => _ContentState();
}
class _ContentState extends State<Content> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
decoration: const BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/content_bg.png'),
fit: BoxFit.cover
)
),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Container(
margin: const EdgeInsets.only(left: 10.0, bottom: 60.0),
child: const CustomButton(name: 'close', size: 60.0,)
),
const ScoreBoard(),
Container(
margin: const EdgeInsets.only(right: 10.0, bottom: 60.0),
child: const CustomButton(name: 'sound', size: 60.0,)
),
],
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Container(
margin: const EdgeInsets.only(left: 5.0),
child: const CustomButton(name: 'previous', size: 100.0,)
),
const SizedBox(
width: 180,
height: 180,
child: ListContentsBox(
imagePath: 'assets/images/list_contents_animals.png',
title: 'Animals'
),
),
Container(
margin: const EdgeInsets.only(right: 5.0),
child: const CustomButton(name: 'next', size: 100.0,)
)
],
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: const [
CustomButton(name: 'microphone', size: 190.0)
],
),
],
),
),
);
}
}

View file

@ -0,0 +1,40 @@
import 'package:flutter/material.dart';
class CustomButton extends StatefulWidget {
const CustomButton({Key? key, required this.name, required this.size}) : super(key: key);
final String name;
final double size;
@override
_CustomButtonState createState() => _CustomButtonState();
}
class _CustomButtonState extends State<CustomButton> {
bool isTap = false;
@override
Widget build(BuildContext context) {
return InkWell(
onTap: () {
setState(() {
isTap = true;
});
},
onTapDown: (x) {
setState(() {
isTap = false;
});
},
child: AnimatedContainer(
duration: const Duration(milliseconds: 150),
width: isTap ? widget.size - 10 : widget.size,
height: isTap ? widget.size - 10 : widget.size,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/buttons/${widget.name}.png'),
)
),
),
);
}
}

View file

@ -0,0 +1,18 @@
import 'package:flutter/material.dart';
class ScoreBoard extends StatelessWidget {
const ScoreBoard({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Container(
width: 250,
height: 200,
decoration: const BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/content_score_board.png'),
)
),
);
}
}