267 lines
8.0 KiB
Dart
267 lines
8.0 KiB
Dart
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';
|
||
|
||
class SearchPage extends StatefulWidget {
|
||
const SearchPage({super.key});
|
||
|
||
@override
|
||
State<StatefulWidget> createState() {
|
||
return _MainRootState();
|
||
}
|
||
}
|
||
|
||
class _MainRootState extends State<SearchPage> {
|
||
|
||
List<String> _searchHistory = [];
|
||
final _searchController = TextEditingController();
|
||
final _searchFocus = FocusNode();
|
||
|
||
final List<String> _titles = const [
|
||
"Mr. Gu's Sweet Weakness",
|
||
'Secret Wife with a Scar',
|
||
'A Second Chance at Love',
|
||
'Shadows of the Heart',
|
||
'Boarding Pass To Love',
|
||
'The Love Blueprint',
|
||
'Who Dared Touch My Bride',
|
||
'Famous Families Fled',
|
||
];
|
||
List<SkywoodDrama> _searchHots = [];
|
||
|
||
Future<void> _loadSearchHistory() async {
|
||
final list = await SearchUtil.getSearchList();
|
||
if (!mounted) return;
|
||
setState(() {
|
||
_searchHistory = list;
|
||
});
|
||
}
|
||
|
||
Future<void> _onGoSearch(String keyword, {bool isTapKey = false}) async {
|
||
if (isTapKey == true) {
|
||
|
||
} else {
|
||
await SearchUtil.addSearch(keyword);
|
||
await _loadSearchHistory();
|
||
}
|
||
HelpNav.to(ResultPage(
|
||
keyword: keyword,
|
||
));
|
||
// 发起 搜索
|
||
|
||
}
|
||
|
||
@override
|
||
void initState() {
|
||
super.initState();
|
||
|
||
_loadSearchHistory();
|
||
_getSearchHots();
|
||
}
|
||
|
||
void _getSearchHots() {
|
||
PlayClient.getSearchHots().then((value) {
|
||
print('object: ${value.length}');
|
||
setState(() {
|
||
_searchHots = value;
|
||
});
|
||
});
|
||
}
|
||
|
||
@override
|
||
Widget build(BuildContext context) {
|
||
return Scaffold(
|
||
appBar: SkyAppBar(
|
||
showBackButton: false,
|
||
titleWidget: SkyTextField(
|
||
controller: _searchController,
|
||
focusNode: _searchFocus,
|
||
border: Border.all(width: 0.6, color: CommonColor.black),
|
||
borderRadius: BorderRadius.circular(20),
|
||
width: 300, height: 36,
|
||
placeholder: 'Search',
|
||
prefix: HelpImg.asset(ConstImg.search, width: 14.w, height: 14.w),
|
||
textInputAction: TextInputAction.search,
|
||
onEditingComplete: () {
|
||
print('object');
|
||
_searchFocus.unfocus();
|
||
if (_searchController.text.trim().isEmpty) return;
|
||
_onGoSearch(_searchController.text);
|
||
},
|
||
),
|
||
),
|
||
body: CustomScrollView(
|
||
slivers: [
|
||
SliverToBoxAdapter(child: _buildHistory()),
|
||
SliverToBoxAdapter(child: SizedBox(height: 30.h)),
|
||
SliverToBoxAdapter(child: _buildTitle('Trending Now')),
|
||
SliverToBoxAdapter(child: SizedBox(height: 10.h)),
|
||
SliverToBoxAdapter(child: _buildTrendingList()),
|
||
SliverToBoxAdapter(child: SizedBox(height: 20.h)),
|
||
],
|
||
),
|
||
);
|
||
}
|
||
|
||
|
||
Widget _buildHistory() {
|
||
return SearchView(
|
||
searchHistory: _searchHistory,
|
||
onTapClear: () {
|
||
_searchHistory.clear();
|
||
setState(() {});
|
||
},
|
||
onTapHistory: (value) {
|
||
print('object: $value');
|
||
HelpNav.to(ResultPage(keyword: value));
|
||
},
|
||
);
|
||
}
|
||
|
||
Widget _buildTitle(String title, {double fontSize = 18}) {
|
||
return Padding(
|
||
padding: EdgeInsets.symmetric(horizontal: 15.w),
|
||
child: Text(
|
||
title,
|
||
style: TextStyle(
|
||
color: CommonColor.black,
|
||
fontSize: fontSize.sp,
|
||
fontWeight: FontWeight.w700,
|
||
height: 1.1,
|
||
),
|
||
),
|
||
);
|
||
}
|
||
|
||
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: 114 * 4 + 20, // 104 * 4 + 10 * 3
|
||
child: ListView.separated(
|
||
scrollDirection: Axis.horizontal,
|
||
padding: EdgeInsets.symmetric(horizontal: 15.w),
|
||
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.drama});
|
||
|
||
final SkywoodDrama drama;
|
||
|
||
@override
|
||
Widget build(BuildContext context) {
|
||
return Container(
|
||
margin: EdgeInsets.only(bottom: 10),
|
||
// width: 236.w,
|
||
// height: 104.w,
|
||
child: Row(
|
||
children: [
|
||
|
||
HelpImg.network(drama.imageUrl, width: 80, height: 104, fit: BoxFit.cover),
|
||
SizedBox(width: 8),
|
||
Expanded(
|
||
child: Padding(
|
||
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,
|
||
),
|
||
),
|
||
],
|
||
),
|
||
],
|
||
),
|
||
),
|
||
),
|
||
),
|
||
],
|
||
),
|
||
);
|
||
}
|
||
}
|