- fix(learn): Modify learn path flow according to the new hierarchy. - add(learn): Add additionl screens for the new hierarchy levels.
124 lines
4.3 KiB
Dart
124 lines
4.3 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:stacked/stacked.dart';
|
|
import 'package:yimaru_app/models/course.dart';
|
|
import 'package:yimaru_app/ui/common/ui_helpers.dart';
|
|
import 'package:yimaru_app/ui/views/learn/learn_viewmodel.dart';
|
|
|
|
import '../common/app_colors.dart';
|
|
import 'custom_elevated_button.dart';
|
|
|
|
class LearnTile extends ViewModelWidget<LearnViewModel> {
|
|
final Course course;
|
|
final GestureTapCallback? onTap;
|
|
|
|
const LearnTile({
|
|
super.key,
|
|
this.onTap,
|
|
required this.course,
|
|
});
|
|
|
|
@override
|
|
Widget build(BuildContext context, LearnViewModel viewModel) =>
|
|
_buildExpansionTileCard(viewModel);
|
|
|
|
Widget _buildExpansionTileCard(LearnViewModel viewModel) => Container(
|
|
margin: const EdgeInsets.only(bottom: 15),
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(5),
|
|
border: Border.all(color: kcPrimaryColor.withOpacity(0.2)
|
|
// color: status == ProgressStatuses.started
|
|
// ? kcPrimaryColor.withOpacity(0.2)
|
|
// : kcVeryLightGrey,
|
|
),
|
|
),
|
|
child: _buildExpansionTile(viewModel),
|
|
);
|
|
|
|
Widget _buildExpansionTile(LearnViewModel viewModel) => ExpansionTile(
|
|
enabled: true,
|
|
textColor: kcDarkGrey,
|
|
showTrailingIcon: true,
|
|
title: _buildTitleRow(),
|
|
initiallyExpanded: false,
|
|
subtitle: _buildContent(),
|
|
collapsedIconColor: kcDarkGrey,
|
|
collapsedTextColor: kcDarkGrey,
|
|
shape: Border.all(color: kcTransparent),
|
|
expandedAlignment: Alignment.centerLeft,
|
|
backgroundColor: kcPrimaryColor.withOpacity(0.1),
|
|
controlAffinity: ListTileControlAffinity.trailing,
|
|
childrenPadding: const EdgeInsets.only(bottom: 15),
|
|
expandedCrossAxisAlignment: CrossAxisAlignment.start,
|
|
tilePadding: const EdgeInsets.symmetric(horizontal: 15),
|
|
collapsedBackgroundColor: kcPrimaryColor.withOpacity(0.1),
|
|
// enabled: status != ProgressStatuses.pending ? true : false,
|
|
// status != ProgressStatuses.pending
|
|
// ? kcPrimaryColor.withOpacity(0.1)
|
|
// : kcBackgroundColor,
|
|
// collapsedBackgroundColor: status != ProgressStatuses.pending
|
|
// ? kcPrimaryColor.withOpacity(0.1)
|
|
// : kcBackgroundColor,
|
|
// showTrailingIcon: status != ProgressStatuses.pending ? true : false,
|
|
// initiallyExpanded: status == ProgressStatuses.started ? true : false,
|
|
children: _buildExpansionTileChildren(viewModel),
|
|
);
|
|
|
|
List<Widget> _buildExpansionTileChildren(LearnViewModel viewModel) => [
|
|
_buildDivider(),
|
|
verticalSpaceTiny,
|
|
_buildActionButtonWrapper(viewModel)
|
|
];
|
|
|
|
Widget _buildTitleRow() => Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: _buildTitleChildren(),
|
|
);
|
|
|
|
List<Widget> _buildTitleChildren() => [
|
|
_buildTitle(),
|
|
// if (status != ProgressStatuses.pending) horizontalSpaceSmall,
|
|
// if (status != ProgressStatuses.pending) _buildProgressStatus()
|
|
];
|
|
|
|
Widget _buildTitle() => Text(
|
|
course.title ?? '',
|
|
style: const TextStyle(
|
|
fontSize: 16,
|
|
color: kcPrimaryColor,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
);
|
|
|
|
// Widget _buildProgressStatus() => ProgressStatus(
|
|
// status: status.name.substring(0, 1).toUpperCase() +
|
|
// status.name.substring(1, status.name.length),
|
|
// color: kcPrimaryColor,
|
|
// );
|
|
|
|
Widget _buildContent() => Text(
|
|
course.description ?? '',
|
|
style: style14DG400,
|
|
);
|
|
|
|
Widget _buildDivider() => const Divider(color: kcVeryLightGrey);
|
|
|
|
Widget _buildActionButtonWrapper(LearnViewModel viewModel) => Padding(
|
|
padding: const EdgeInsets.symmetric(horizontal: 15),
|
|
child: _buildActionButton(viewModel),
|
|
);
|
|
|
|
Widget _buildActionButton(LearnViewModel viewModel) => CustomElevatedButton(
|
|
height: 15,
|
|
onTap: onTap,
|
|
borderRadius: 12,
|
|
text: 'Start Course',
|
|
foregroundColor: kcWhite,
|
|
backgroundColor: kcPrimaryColor,
|
|
// text: status == ProgressStatuses.completed
|
|
// ? 'Review Course'
|
|
// : status == ProgressStatuses.pending
|
|
// ? 'Start Learning'
|
|
// : 'Continue Learning',
|
|
);
|
|
}
|