Jisho-Study-Tool/lib/view/components/kanji/result/yomi_chips.dart

123 lines
2.5 KiB
Dart

import 'package:flutter/material.dart';
import 'package:jisho_study_tool/bloc/theme/theme_bloc.dart';
enum YomiType {
onyomi,
kunyomi,
meaning,
}
extension on YomiType {
String get title {
switch (this) {
case YomiType.onyomi:
return 'Onyomi';
case YomiType.kunyomi:
return 'Kunyomi';
case YomiType.meaning:
return 'Meanings';
}
}
ColorSet getColors(BuildContext context) {
final theme = BlocProvider.of<ThemeBloc>(context).state.theme;
switch (this) {
case YomiType.onyomi:
return theme.onyomiColor;
case YomiType.kunyomi:
return theme.kunyomiColor;
case YomiType.meaning:
return theme.menuGreyNormal;
}
}
}
class YomiChips extends StatelessWidget {
final List<String> yomi;
final YomiType type;
const YomiChips(this.yomi, this.type);
@override
Widget build(BuildContext context) {
return Container(
margin: EdgeInsets.symmetric(
horizontal: 10.0,
vertical: 5.0,
),
alignment: Alignment.centerLeft,
child: _yomiWrapper(context),
);
}
bool isExpandable() => yomi.length > 6;
Widget _yomiWrapper(BuildContext context) {
final yomiCards = this
.yomi
.map((yomi) => _YomiCard(
yomi: yomi,
colors: this.type.getColors(context),
))
.toList();
if (!this.isExpandable())
return Wrap(
runSpacing: 10.0,
children: yomiCards,
);
return ExpansionTile(
initiallyExpanded: false,
title: Center(
child: _YomiCard(
yomi: this.type.title,
colors: this.type.getColors(context),
),
),
children: [
SizedBox(
height: 20.0,
),
Wrap(
runSpacing: 10.0,
children: yomiCards,
),
SizedBox(
height: 25.0,
),
],
);
}
}
class _YomiCard extends StatelessWidget {
final String yomi;
final ColorSet colors;
const _YomiCard({required this.yomi, required this.colors});
@override
Widget build(BuildContext context) {
return Container(
margin: EdgeInsets.symmetric(horizontal: 10.0),
padding: EdgeInsets.symmetric(
vertical: 10.0,
horizontal: 10.0,
),
child: Text(
this.yomi,
style: TextStyle(
fontSize: 20.0,
color: colors.foreground,
),
),
decoration: BoxDecoration(
color: colors.background,
borderRadius: BorderRadius.circular(10.0),
),
);
}
}