laiiihz
5 years ago
parent
2882c191d9
commit
15433de10a
|
After Width: | Height: | Size: 1.0 KiB |
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 729 B |
|
After Width: | Height: | Size: 768 B |
@ -0,0 +1,17 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class ImageTextPage extends StatefulWidget {
|
||||
ImageTextPage({Key key}) : super(key: key);
|
||||
|
||||
@override
|
||||
_ImageTextPageState createState() => _ImageTextPageState();
|
||||
}
|
||||
|
||||
class _ImageTextPageState extends State<ImageTextPage> {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
appBar: AppBar(),
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,269 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:recook/constants/header.dart';
|
||||
import 'package:recook/widgets/custom_image_button.dart';
|
||||
|
||||
class LiveStreamPage extends StatefulWidget {
|
||||
LiveStreamPage({Key key}) : super(key: key);
|
||||
|
||||
@override
|
||||
_LiveStreamPageState createState() => _LiveStreamPageState();
|
||||
}
|
||||
|
||||
class _LiveStreamPageState extends State<LiveStreamPage> {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Column(
|
||||
children: [
|
||||
_buildAttentions(),
|
||||
Expanded(
|
||||
child: _buildLiveUsers(),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
_buildAttentions() {
|
||||
return Container(
|
||||
height: rSize(102),
|
||||
child: Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: ListView.separated(
|
||||
padding: EdgeInsets.symmetric(
|
||||
horizontal: rSize(20),
|
||||
vertical: rSize(15),
|
||||
),
|
||||
separatorBuilder: (context, index) {
|
||||
return SizedBox(width: rSize(16));
|
||||
},
|
||||
scrollDirection: Axis.horizontal,
|
||||
itemBuilder: (context, index) {
|
||||
return _buildAttentionBox('user $index');
|
||||
},
|
||||
itemCount: 20,
|
||||
),
|
||||
),
|
||||
Container(
|
||||
width: rSize(52),
|
||||
child: CustomImageButton(
|
||||
height: rSize(102),
|
||||
onPressed: () {},
|
||||
child: Text(
|
||||
'全部\n关注',
|
||||
style: TextStyle(
|
||||
color: Color(0xFFDB2D2D),
|
||||
fontSize: rSP(11),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
_buildAttentionBox(String nickName) {
|
||||
return Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Stack(
|
||||
children: [
|
||||
CircleAvatar(
|
||||
radius: rSize(52 / 2),
|
||||
),
|
||||
Positioned(
|
||||
right: rSize(3),
|
||||
bottom: 0,
|
||||
child: Image.asset(
|
||||
R.ASSETS_LIVE_ON_STREAM_PNG,
|
||||
height: rSize(12),
|
||||
width: rSize(12),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
SizedBox(height: rSize(4)),
|
||||
Text(
|
||||
nickName,
|
||||
style: TextStyle(
|
||||
color: Color(0xFF666666),
|
||||
fontSize: rSP(11),
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
_buildLiveUsers() {
|
||||
return GridView.builder(
|
||||
padding: EdgeInsets.symmetric(
|
||||
horizontal: rSize(16),
|
||||
vertical: rSize(5),
|
||||
),
|
||||
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
|
||||
crossAxisCount: 2,
|
||||
childAspectRatio: 165 / 249,
|
||||
crossAxisSpacing: rSize(15),
|
||||
mainAxisSpacing: rSize(15),
|
||||
),
|
||||
itemBuilder: (context, index) {
|
||||
return _buildGridCard();
|
||||
},
|
||||
itemCount: 20,
|
||||
);
|
||||
}
|
||||
|
||||
_buildGridCard() {
|
||||
return ClipRRect(
|
||||
borderRadius: BorderRadius.circular(rSize(10)),
|
||||
child: Container(
|
||||
color: Colors.white,
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
children: [
|
||||
Stack(
|
||||
children: [
|
||||
AspectRatio(
|
||||
aspectRatio: 1,
|
||||
child: Container(
|
||||
color: Colors.blueGrey,
|
||||
child: Placeholder(),
|
||||
),
|
||||
),
|
||||
Positioned(
|
||||
left: rSize(10),
|
||||
top: rSize(10),
|
||||
child: Container(
|
||||
height: rSize(15),
|
||||
decoration: BoxDecoration(
|
||||
color: Color(0xFF050505).withOpacity(0.18),
|
||||
borderRadius: BorderRadius.circular(rSize(2)),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Image.asset(R.ASSETS_LIVE_ON_STREAM_PNG),
|
||||
Text(
|
||||
'1234人观看',
|
||||
style: TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: rSP(10),
|
||||
),
|
||||
),
|
||||
SizedBox(width: rSize(2)),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
Positioned(
|
||||
right: rSize(10),
|
||||
bottom: rSize(2),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Image.asset(
|
||||
R.ASSETS_LIVE_FAVORITE_PNG,
|
||||
width: rSize(10),
|
||||
height: rSize(10),
|
||||
),
|
||||
Text(
|
||||
'334',
|
||||
style: TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: rSP(10),
|
||||
),
|
||||
),
|
||||
SizedBox(width: rSize(2)),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
Expanded(
|
||||
child: Padding(
|
||||
padding: EdgeInsets.all(rSize(10)),
|
||||
child: Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Column(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Text(
|
||||
'年中厨具福利专场年中厨具福利专场…',
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: TextStyle(
|
||||
color: Color(0xFF333333),
|
||||
fontSize: rSP(13),
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
),
|
||||
Row(
|
||||
children: [
|
||||
CircleAvatar(
|
||||
radius: rSize(10),
|
||||
),
|
||||
Expanded(
|
||||
child: Padding(
|
||||
padding: EdgeInsets.symmetric(
|
||||
horizontal: rSize(6),
|
||||
),
|
||||
child: Text(
|
||||
'NAME NAME NAME',
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: TextStyle(
|
||||
fontSize: rSP(13),
|
||||
color: Color(0xFF333333),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
SizedBox(width: rSize(10)),
|
||||
AspectRatio(
|
||||
aspectRatio: 50 / 64,
|
||||
child: ClipRRect(
|
||||
borderRadius: BorderRadius.circular(rSize(5)),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
AspectRatio(
|
||||
aspectRatio: 1,
|
||||
child: Container(
|
||||
color: Colors.blue,
|
||||
child: Placeholder(),
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: Container(
|
||||
alignment: Alignment.center,
|
||||
color: Color(0xFFF7F7F7),
|
||||
child: Text(
|
||||
'¥244',
|
||||
style: TextStyle(
|
||||
color: Color(0xFF333333),
|
||||
fontSize: rSP(10),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Loading…
Reference in new issue