projectdx/yommi_ff
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI: Add ChannelTile with logos, search/filter, and design improvements

Browse Source
This commit is contained in:
projectdx
2026-01-11 20:16:01 +09:00
parent c3a95684f3
commit e3bca82285
9 changed files with 265 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
lib/widgets/channel_list.dart
View File

@@ -3,32 +3,58 @@ import 'package:flutter_riverpod/flutter_riverpod.dart';
import '../models/stream_entry.dart';
import '../providers/m3u_provider.dart';
import '../player_screen.dart';
import 'channel_tile.dart';
class ChannelList extends ConsumerWidget {
class ChannelList extends ConsumerStatefulWidget {
final TextEditingController m3uController;
const ChannelList({super.key, required this.m3uController});
@override
Widget build(BuildContext context, WidgetRef ref) {
ConsumerState<ChannelList> createState() => _ChannelListState();
}
class _ChannelListState extends ConsumerState<ChannelList> {
String _query = '';
@override
Widget build(BuildContext context) {
final state = ref.watch(channelListProvider);
final selected = ref.watch(selectedChannelProvider);
return Container(
width: 320,
width: 360,
decoration: BoxDecoration(color: Colors.grey[900]),
child: Column(children: [
Padding(
padding: const EdgeInsets.all(12.0),
child: Row(children: [
const Expanded(
child: Text('실시간 채널',
style:
TextStyle(fontSize: 18, fontWeight: FontWeight.bold))),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text('실시간 채널',
style:
TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
const SizedBox(height: 6),
TextField(
onChanged: (v) => setState(() => _query = v),
decoration: InputDecoration(
hintText: 'Search channels',
filled: true,
fillColor: Colors.grey[850],
prefixIcon:
const Icon(Icons.search, color: Colors.white70),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: BorderSide.none),
),
)
])),
IconButton(
onPressed: () => ref
.read(channelListProvider.notifier)
.fetch(m3uController.text.trim()),
.fetch(widget.m3uController.text.trim()),
icon: const Icon(Icons.refresh)),
]),
),
@@ -36,29 +62,28 @@ class ChannelList extends ConsumerWidget {
Expanded(
child: state.when(
data: (list) {
if (list.isEmpty)
return const Center(child: Text('채널이 없습니다. M3U를 불러오세요.'));
return ListView.separated(
itemCount: list.length,
separatorBuilder: (_, __) => const Divider(height: 1),
final filtered = list
.where((s) =>
s.title.toLowerCase().contains(_query.toLowerCase()) ||
s.url.toLowerCase().contains(_query.toLowerCase()))
.toList();
if (filtered.isEmpty)
return const Center(child: Text('채널이 없습니다. 검색어를 변경해보세요.'));
return ListView.builder(
itemCount: filtered.length,
itemBuilder: (context, idx) {
final s = list[idx];
final s = filtered[idx];
final isSelected = selected?.url == s.url;
return ListTile(
return ChannelTile(
entry: s,
selected: isSelected,
title: Text(s.title, overflow: TextOverflow.ellipsis),
subtitle: Text(s.url,
overflow: TextOverflow.ellipsis, maxLines: 1),
onTap: () =>
ref.read(selectedChannelProvider.notifier).state = s,
trailing: IconButton(
icon: const Icon(Icons.open_in_full),
onPressed: () => Navigator.push(
context,
MaterialPageRoute(
builder: (_) => PlayerScreen(
videoPath: s.url, videoName: s.title))),
),
onOpen: () => Navigator.push(
context,
MaterialPageRoute(
builder: (_) => PlayerScreen(
videoPath: s.url, videoName: s.title))),
);
},
);
@@ -71,7 +96,7 @@ class ChannelList extends ConsumerWidget {
ElevatedButton(
onPressed: () => ref
.read(channelListProvider.notifier)
.fetch(m3uController.text.trim()),
.fetch(widget.m3uController.text.trim()),
child: const Text('다시시도'))
])),
),

82
lib/widgets/channel_tile.dart Normal file
View File

@@ -0,0 +1,82 @@
import 'package:flutter/material.dart';
import 'package:cached_network_image/cached_network_image.dart';
import '../models/stream_entry.dart';
class ChannelTile extends StatelessWidget {
final StreamEntry entry;
final bool selected;
final VoidCallback? onTap;
final VoidCallback? onOpen;
const ChannelTile(
{super.key,
required this.entry,
this.selected = false,
this.onTap,
this.onOpen});
@override
Widget build(BuildContext context) {
final border = selected
? Border.all(color: Theme.of(context).colorScheme.primary, width: 2)
: null;
return Card(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10), side: BorderSide.none),
color: selected ? Colors.grey[850] : Colors.transparent,
margin: const EdgeInsets.symmetric(horizontal: 8, vertical: 6),
child: InkWell(
borderRadius: BorderRadius.circular(10),
onTap: onTap,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
decoration: BoxDecoration(
border: border, borderRadius: BorderRadius.circular(10)),
child: Row(children: [
ClipRRect(
borderRadius: BorderRadius.circular(6),
child: SizedBox(
width: 56,
height: 40,
child: entry.logo != null
? CachedNetworkImage(
imageUrl: entry.logo!,
fit: BoxFit.cover,
placeholder: (c, s) =>
Container(color: Colors.grey[800]),
errorWidget: (c, s, e) => Container(
color: Colors.grey[800],
child: const Icon(Icons.tv, color: Colors.white30)),
)
: Container(
color: Colors.grey[800],
child: const Icon(Icons.tv, color: Colors.white30)),
),
),
const SizedBox(width: 12),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(entry.title,
style: const TextStyle(
fontSize: 15,
fontWeight: FontWeight.w600,
color: Colors.white)),
const SizedBox(height: 4),
Text(entry.url,
style: TextStyle(fontSize: 11, color: Colors.white70),
overflow: TextOverflow.ellipsis,
maxLines: 1),
])),
IconButton(
icon: const Icon(Icons.open_in_new, color: Colors.white70),
onPressed: onOpen,
tooltip: 'Open full screen')
]),
),
),
);
}
}