import 'package:flutter/material.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:get/get.dart'; import 'package:nomo/app/base/base_view.dart'; import 'package:nomo/app/widgets/click_opacity.dart'; import 'package:nomo/app/widgets/ix_app_bar.dart'; import 'package:nomo/config/theme/theme_extensions/theme_extension.dart'; import '../controllers/language_controller.dart'; class LanguageView extends BaseView { const LanguageView({super.key}); @override PreferredSizeWidget? get appBar => IXAppBar(title: 'Language'); @override Widget buildContent(BuildContext context) { return SingleChildScrollView( child: Padding( padding: EdgeInsets.symmetric(horizontal: 14.w, vertical: 10.w), child: Container( decoration: BoxDecoration( color: Get.reactiveTheme.highlightColor, borderRadius: BorderRadius.circular(12.r), ), child: Obx( () => Column( children: controller.languages.asMap().entries.map((entry) { final index = entry.key; final language = entry.value; final isSelected = controller.selectedLanguage.value == language.code; return Column( children: [ _buildLanguageOption( language: language, isSelected: isSelected, onTap: () => controller.selectLanguage(language.code), ), if (index < controller.languages.length - 1) _buildDivider(), ], ); }).toList(), ), ), ), ), ); } /// 构建语言选项 Widget _buildLanguageOption({ required LanguageInfo language, required bool isSelected, required VoidCallback onTap, }) { return ClickOpacity( onTap: onTap, child: Padding( padding: EdgeInsets.all(14.w), child: Row( children: [ // 语言信息 Expanded( child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( language.name, style: TextStyle( fontSize: 14.sp, height: 1.4, fontWeight: FontWeight.w600, color: isSelected ? Get.reactiveTheme.shadowColor : Get.reactiveTheme.textTheme.bodyLarge!.color, ), ), Text( language.nativeName, style: TextStyle( fontSize: 12.sp, height: 1.6, color: Get.reactiveTheme.hintColor, ), ), ], ), ), // 选中指示器 Container( width: 20.w, height: 20.w, decoration: BoxDecoration( shape: BoxShape.circle, color: isSelected ? Get.reactiveTheme.shadowColor : Colors.transparent, border: Border.all( color: isSelected ? Get.reactiveTheme.shadowColor : Colors.grey[400]!, width: 1.5.w, ), ), child: isSelected ? Icon(Icons.check, color: Colors.white, size: 16.w) : null, ), ], ), ), ); } /// 构建分割线 Widget _buildDivider() { return Divider(color: Get.reactiveTheme.dividerColor, height: 1.w); } }