feat: 首页，播放页，搜索页，收藏UI
This commit is contained in:
chengsiwen committed
1 parent
197c3e9b88
commit
e59ac2177b
19 files changed
+475
-81
No files matched your search
@@ -1,10 +1,13 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:skywood/global/client/play_client.dart';
|
||||
import 'package:skywood/main/lib_file.dart';
|
||||
import 'package:skywood/pages/search/page/result_page.dart';
|
||||
import 'package:skywood/pages/search/widget/search_util.dart';
|
||||
import 'package:skywood/pages/search/widget/search_view.dart';
|
||||
import 'package:skywood/pages/widgets/pixel_widgets.dart';
|
||||
import 'package:skywood/utils/models/drama/skywood_drama.dart';
|
||||
import 'package:skywood/utils/tools/help_nav.dart';
|
||||
import 'package:skywood/utils/tools/sky_time_tool.dart';
|
||||
import 'package:skywood/utils/tools/widgets/sky_app_bar.dart';
|
||||
import 'package:skywood/utils/tools/widgets/sky_text_field.dart';
|
||||
|
||||
@@ -33,6 +36,7 @@ class _MainRootState extends State<SearchPage> {
|
||||
'Who Dared Touch My Bride',
|
||||
'Famous Families Fled',
|
||||
];
|
||||
List<SkywoodDrama> _searchHots = [];
|
||||
|
||||
Future<void> _loadSearchHistory() async {
|
||||
final list = await SearchUtil.getSearchList();
|
||||
@@ -61,6 +65,16 @@ class _MainRootState extends State<SearchPage> {
|
||||
super.initState();
|
||||
|
||||
_loadSearchHistory();
|
||||
_getSearchHots();
|
||||
}
|
||||
|
||||
void _getSearchHots() {
|
||||
PlayClient.getSearchHots().then((value) {
|
||||
print('object: ${value.length}');
|
||||
setState(() {
|
||||
_searchHots = value;
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
@override
|
||||
@@ -129,76 +143,119 @@ class _MainRootState extends State<SearchPage> {
|
||||
}
|
||||
|
||||
Widget _buildTrendingList() {
|
||||
if (_searchHots.isEmpty) return const SizedBox.shrink();
|
||||
|
||||
// 每4个一组
|
||||
final List<List<SkywoodDrama>> groupedData = [];
|
||||
for (int i = 0; i < _searchHots.length; i += 4) {
|
||||
final end = (i + 4 > _searchHots.length) ? _searchHots.length : i + 4;
|
||||
groupedData.add(_searchHots.sublist(i, end));
|
||||
}
|
||||
|
||||
return SizedBox(
|
||||
height: 446.h,
|
||||
child: SingleChildScrollView(
|
||||
height: 114 * 4 + 20, // 104 * 4 + 10 * 3
|
||||
child: ListView.separated(
|
||||
scrollDirection: Axis.horizontal,
|
||||
padding: EdgeInsets.symmetric(horizontal: 15.w),
|
||||
child: Wrap(
|
||||
direction: Axis.vertical,
|
||||
spacing: 10.h,
|
||||
runSpacing: 10.w,
|
||||
children: _titles
|
||||
.map((title) => _TrendingItem(title: title))
|
||||
.toList(),
|
||||
),
|
||||
itemBuilder: (context, index) {
|
||||
final group = groupedData[index];
|
||||
return _buildGroup(group);
|
||||
},
|
||||
separatorBuilder: (context, index) => SizedBox(width: 10.w),
|
||||
itemCount: groupedData.length,
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
/// 一组卡片（垂直排列，最多4个）
|
||||
Widget _buildGroup(List<SkywoodDrama> group) {
|
||||
return SizedBox(
|
||||
width: 236,
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: group.map((drama) {
|
||||
return _TrendingItem(drama: drama);
|
||||
}).toList(),
|
||||
),
|
||||
);
|
||||
}
|
||||
// Widget _buildTrendingList() {
|
||||
// return Container(
|
||||
// height: 114 * 4, width: AppScreen.screenWidth,
|
||||
// color: Colors.green,
|
||||
// child: GridView.builder(
|
||||
// padding: EdgeInsets.only(left: 15.w),
|
||||
// scrollDirection: Axis.horizontal,
|
||||
// gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
|
||||
// crossAxisCount: 4, // 上下4行
|
||||
// crossAxisSpacing: 10, // 行间距（垂直方向）
|
||||
// mainAxisSpacing: 10, // 列间距（水平方向）
|
||||
// childAspectRatio: 236 / 104.0, // 宽高比（宽度/高度）
|
||||
// ),
|
||||
// itemCount: _searchHots.length,
|
||||
// itemBuilder: (context, index) {
|
||||
// final drama = _searchHots[index];
|
||||
// return Container(width: 236, height: 104, color: index%2==0 ? Colors.orangeAccent : Colors.redAccent,);
|
||||
// return _TrendingItem(drama: drama);
|
||||
// }
|
||||
// ),
|
||||
// );
|
||||
// }
|
||||
}
|
||||
|
||||
class _TrendingItem extends StatelessWidget {
|
||||
const _TrendingItem({required this.title});
|
||||
const _TrendingItem({required this.drama});
|
||||
|
||||
final String title;
|
||||
final SkywoodDrama drama;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return SizedBox(
|
||||
width: 236.w,
|
||||
height: 104.h,
|
||||
return Container(
|
||||
margin: EdgeInsets.only(bottom: 10),
|
||||
// width: 236.w,
|
||||
// height: 104.w,
|
||||
child: Row(
|
||||
children: [
|
||||
const PosterImage(
|
||||
width: 80,
|
||||
height: 104,
|
||||
borderRadius: 4,
|
||||
showBorder: false,
|
||||
),
|
||||
SizedBox(width: 8.w),
|
||||
|
||||
HelpImg.network(drama.imageUrl, width: 80, height: 104, fit: BoxFit.cover),
|
||||
SizedBox(width: 8),
|
||||
Expanded(
|
||||
child: Padding(
|
||||
padding: EdgeInsets.symmetric(vertical: 10.h),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
title,
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: TextStyle(
|
||||
color: CommonColor.black,
|
||||
fontSize: 13.sp,
|
||||
fontWeight: FontWeight.bold,
|
||||
height: 1.2,
|
||||
),
|
||||
),
|
||||
Row(
|
||||
children: [
|
||||
HelpImg.asset(ConstImg.hot, width: 15.w, height: 15.w),
|
||||
SizedBox(width: 2.w),
|
||||
Text(
|
||||
'17.3K',
|
||||
style: TextStyle(
|
||||
color: const Color(0x80000000),
|
||||
fontSize: 13.w,
|
||||
height: 1,
|
||||
),
|
||||
padding: EdgeInsets.symmetric(vertical: 10),
|
||||
child: SizedBox(
|
||||
height: 84,
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
drama.name,
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: TextStyle(
|
||||
color: CommonColor.black,
|
||||
fontSize: 13.sp,
|
||||
fontWeight: FontWeight.bold,
|
||||
height: 1.2,
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
Spacer(),
|
||||
Row(
|
||||
children: [
|
||||
HelpImg.asset(ConstImg.hot, width: 15.w, height: 15.w),
|
||||
SizedBox(width: 2.w),
|
||||
Text(
|
||||
SkyTimeTool.formatNum(drama.watchTotal, unit: 'w'),
|
||||
style: TextStyle(
|
||||
color: const Color(0x80000000),
|
||||
fontSize: 13.w,
|
||||
height: 1,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
Reference in new issue
Block a user