chengsiwen/skywood
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: UI pages

Browse Source
This commit is contained in:
chengsiwen committed 2026-06-28 17:16:31 +08:00
1 parent fbcd33ea2b
commit 197c3e9b88
41 files changed
+1270 -274
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

lib/pages/search/page/result_page.dart
+155
View File
@@ -0,0 +1,155 @@
import 'package:flutter/material.dart';
import 'package:skywood/main/lib_file.dart';
import 'package:skywood/pages/widgets/pixel_widgets.dart';
import 'package:skywood/utils/tools/widgets/sky_app_bar.dart';
import 'package:skywood/utils/tools/widgets/sky_common_widget.dart';
import '../../../utils/tools/widgets/sky_text_field.dart';
class ResultPage extends StatefulWidget {
const ResultPage({super.key,
required this.keyword,
});
final String keyword;
@override
State<StatefulWidget> createState() {
return _ResultPageState();
}
}
class _ResultPageState extends State<ResultPage> {
List<String> _searchHistory = [];
final _searchController = TextEditingController();
final _searchFocus = FocusNode();
@override
void initState() {
super.initState();
_searchController.text = widget.keyword;
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: SkyAppBar(
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: ListView.separated(
itemBuilder: (context, index) => ResultItemView(),
separatorBuilder: (context, index) => SizedBox(height: 12),
itemCount: 2
),
);
}
}
class ResultItemView extends StatelessWidget {
const ResultItemView({super.key});
@override
Widget build(BuildContext context) {
return Container(
height: 140.h,
padding: const EdgeInsets.symmetric(horizontal: 15),
child: Row(
children: [
PosterImage(width: 105.w, height: 140.h),
const SizedBox(width: 10),
Expanded(child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SkyText(text: 'Love in the City of Twilight',
fontSize: 14,
fontWeight: FontWeight.bold,
color: CommonColor.black,
),
const SizedBox(height: 12),
_tagView(),
const SizedBox(height: 12),
SkyText(text: 'Haunted by fading memories, a man navigates a labyrinth of dreams and reality ds dsajkj',
fontSize: 11,
color: CommonColor.withValue('4D4047'),
maxLines: 2,
),
Spacer(),
Row(
children: [
_tipView(true, text: '10.0'),
const SizedBox(width: 15),
_tipView(false, text: '10.2k'),
],
)
],
))
],
),
);
}
Widget _tipView(bool isStar, {required String text}) {
String imgName = isStar ? ConstImg.star : ConstImg.look;
return Row(
children: [
HelpImg.asset(imgName, width: 12.w, height: 12.w),
const SizedBox(width: 2),
SkyText(text: text, fontSize: 10, color: Colors.grey)
],
);
}
Widget _tagView() {
return Container(
padding: const EdgeInsets.only(top: 3, left: 6, right: 6, bottom: 4),
decoration: ShapeDecoration(
color: const Color(0xFFEBFFE5),
shape: RoundedRectangleBorder(
side: BorderSide(
width: 0.50,
color: const Color(0xFF9BE89C),
),
borderRadius: BorderRadius.circular(1),
),
),
child: Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
spacing: 10,
children: [
Text(
'Satisfying',
style: TextStyle(
color: const Color(0xFF040408) /* 主题黑 */,
fontSize: 10,
fontFamily: 'Inter',
fontWeight: FontWeight.w400,
height: 1,
),
),
],
),
);
}
}
lib/pages/search/page/search_page.dart
+209
View File
@@ -0,0 +1,209 @@
import 'package:flutter/material.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/tools/help_nav.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',
];
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();
}
@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() {
return SizedBox(
height: 446.h,
child: SingleChildScrollView(
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(),
),
),
);
}
}
class _TrendingItem extends StatelessWidget {
const _TrendingItem({required this.title});
final String title;
@override
Widget build(BuildContext context) {
return SizedBox(
width: 236.w,
height: 104.h,
child: Row(
children: [
const PosterImage(
width: 80,
height: 104,
borderRadius: 4,
showBorder: false,
),
SizedBox(width: 8.w),
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,
),
),
],
),
],
),
),
),
],
),
);
}
}
lib/pages/search/search_page.dart
-234
View File
@@ -1,234 +0,0 @@
import 'package:flutter/material.dart';
import 'package:skywood/main/lib_file.dart';
import 'package:skywood/pages/widgets/pixel_widgets.dart';
class SearchPage extends StatefulWidget {
const SearchPage({super.key});
@override
State<StatefulWidget> createState() {
return _MainRootState();
}
}
class _MainRootState extends State<SearchPage> {
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',
];
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
body: SafeArea(
bottom: false,
child: CustomScrollView(
slivers: [
SliverToBoxAdapter(child: _buildSearchBar()),
SliverToBoxAdapter(child: SizedBox(height: 16.h)),
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: 120.h)),
],
),
),
);
}
Widget _buildSearchBar() {
return Padding(
padding: EdgeInsets.fromLTRB(15.w, 10.h, 15.w, 0),
child: Row(
children: [
Container(
width: 34.w,
height: 34.w,
decoration: BoxDecoration(
color: const Color(0xFFB6FFA7),
border: Border.all(color: CommonColor.black, width: 1.w),
boxShadow: const [
BoxShadow(color: Color(0xFF91F473), offset: Offset(2, 2)),
],
),
child: Icon(
Icons.arrow_back_ios_new,
size: 16.w,
color: CommonColor.black,
),
),
SizedBox(width: 10.w),
Expanded(
child: Container(
height: 36.h,
padding: EdgeInsets.symmetric(horizontal: 12.w),
decoration: BoxDecoration(
border: Border.all(color: CommonColor.black, width: 1.w),
borderRadius: BorderRadius.circular(40.r),
),
child: Row(
children: [
Icon(Icons.search, size: 16.w, color: CommonColor.black),
SizedBox(width: 7.w),
Text(
'Search',
style: TextStyle(
color: const Color(0xFF3E3D40),
fontSize: 12.sp,
height: 1,
),
),
],
),
),
),
],
),
);
}
Widget _buildHistory() {
return Padding(
padding: EdgeInsets.symmetric(horizontal: 15.w),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Expanded(child: _buildTitle('Search History', fontSize: 14)),
Icon(
Icons.delete_outline,
size: 18.w,
color: const Color(0xFF888888),
),
],
),
SizedBox(height: 10.h),
Container(
padding: EdgeInsets.symmetric(horizontal: 12.w, vertical: 8.h),
decoration: BoxDecoration(
color: const Color(0x0D000000),
borderRadius: BorderRadius.circular(20.r),
),
child: Text(
'Love',
style: TextStyle(
color: const Color(0x80000000),
fontSize: 12.sp,
fontWeight: FontWeight.w500,
height: 1,
),
),
),
],
),
);
}
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() {
return SizedBox(
height: 446.h,
child: SingleChildScrollView(
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(),
),
),
);
}
}
class _TrendingItem extends StatelessWidget {
const _TrendingItem({required this.title});
final String title;
@override
Widget build(BuildContext context) {
return SizedBox(
width: 236.w,
height: 104.h,
child: Row(
children: [
const PosterImage(
width: 80,
height: 104,
borderRadius: 4,
showBorder: false,
),
SizedBox(width: 8.w),
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.w500,
height: 1.2,
),
),
Row(
children: [
Icon(
Icons.local_fire_department,
size: 15.w,
color: const Color(0xFFFF6A00),
),
SizedBox(width: 2.w),
Text(
'17.3K',
style: TextStyle(
color: const Color(0x80000000),
fontSize: 10.sp,
height: 1,
),
),
],
),
],
),
),
),
],
),
);
}
}
lib/pages/search/widget/search_util.dart
+63
View File
@@ -0,0 +1,63 @@
import 'dart:convert';
import 'package:shared_preferences/shared_preferences.dart';
import '../../../utils/tools/app_sp.dart';
/// 本地搜索历史（SharedPreferences），key 与 [AppSp] 规则一致（`.search.history`）。
class SearchUtil {
SearchUtil._();
static const String _storageKey = 'sky.search.history';
static const int _maxHistory = 20;
static Future<List<String>> _readList(SharedPreferences prefs) async {
final raw = prefs.getString(_storageKey);
if (raw == null || raw.isEmpty) return [];
try {
final decoded = jsonDecode(raw);
if (decoded is! List) return [];
return decoded.map((e) => e.toString()).where((s) => s.isNotEmpty).toList();
} catch (_) {
return [];
}
}
static Future<void> _writeList(SharedPreferences prefs, List<String> list) async {
await prefs.setString(_storageKey, jsonEncode(list));
}
/// 查询搜索历史列表（新记录在前）。
static Future<List<String>> getSearchList() async {
final prefs = await AppSp.getInstance();
return _readList(prefs);
}
/// 添加一条搜索；去重、去空白，并移到最前。
static Future<void> addSearch(String keyword) async {
final q = keyword.trim();
if (q.isEmpty) return;
final prefs = await AppSp.getInstance();
final list = await _readList(prefs);
list.removeWhere((e) => e == q);
list.insert(0, q);
if (list.length > _maxHistory) {
list.removeRange(_maxHistory, list.length);
}
await _writeList(prefs, list);
}
/// 删除单条搜索记录。
static Future<void> deleteSearch(String keyword) async {
final prefs = await AppSp.getInstance();
final list = await _readList(prefs);
list.removeWhere((e) => e == keyword);
await _writeList(prefs, list);
}
/// 清空全部搜索历史。
static Future<void> clearAllSearch() async {
final prefs = await AppSp.getInstance();
await prefs.remove(_storageKey);
}
}
lib/pages/search/widget/search_view.dart
+89
View File
@@ -0,0 +1,89 @@
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:skywood/global/const/common_color.dart';
import 'package:skywood/main/lib_file.dart';
import 'package:skywood/utils/tools/widgets/sky_common_widget.dart';
class SearchView extends StatelessWidget {
const SearchView({super.key,
required this.searchHistory,
this.onTapHistory,
this.onTapClear,
});
final List<String> searchHistory;
final ValueChanged<String>? onTapHistory;
final Function()? onTapClear;
@override
Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.symmetric(horizontal: 15.w),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Expanded(child: SkyText(text: 'Search History',
fontSize: 14,
color: CommonColor.black,
fontWeight: FontWeight.bold,
lineHeight: 1,
)),
IconButton(onPressed: () {
onTapClear?.call();
}, icon: HelpImg.asset(ConstImg.delete, width: 16.w, height: 16.w)),
],
),
Wrap(
spacing: 16.w,
runSpacing: 14.h,
children: searchHistory
.map(
(item) => _HistoryChip(
text: item,
onTap: () => onTapHistory?.call(item),
),
)
.toList(),
),
],
),
);
}
}
class _HistoryChip extends StatelessWidget {
const _HistoryChip({
required this.text,
this.onTap,
});
final String text;
final VoidCallback? onTap;
@override
Widget build(BuildContext context) {
return InkWell(
onTap: onTap,
child: Container(
padding: EdgeInsets.symmetric(horizontal: 12.w, vertical: 8.h),
decoration: BoxDecoration(
color: const Color(0x0D000000),
borderRadius: BorderRadius.circular(20.r),
),
child: Text(
text,
style: TextStyle(
color: const Color(0x80000000),
fontSize: 12.sp,
fontWeight: FontWeight.w500,
height: 1,
),
),
),
);
}
}