Merge pull request #1257 from 21pages/tabbar

optimize ui
This commit is contained in:
RustDesk 2022-08-12 09:38:55 +08:00 committed by GitHub
commit 2e9a6ed4f6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 47 additions and 40 deletions

View File

@ -249,9 +249,12 @@ class _DesktopHomePageState extends State<DesktopHomePage>
Expanded( Expanded(
child: GestureDetector( child: GestureDetector(
onDoubleTap: () { onDoubleTap: () {
Clipboard.setData( if (model.verificationMethod !=
ClipboardData(text: model.serverPasswd.text)); kUsePermanentPassword) {
showToast(translate("Copied")); Clipboard.setData(
ClipboardData(text: model.serverPasswd.text));
showToast(translate("Copied"));
}
}, },
child: TextFormField( child: TextFormField(
controller: model.serverPasswd, controller: model.serverPasswd,

View File

@ -7,7 +7,6 @@ import 'package:flutter_hbb/utils/multi_window_manager.dart';
import 'package:get/get.dart'; import 'package:get/get.dart';
const double _kTabBarHeight = kDesktopRemoteTabBarHeight; const double _kTabBarHeight = kDesktopRemoteTabBarHeight;
const double _kTabFixedWidth = 150;
const double _kIconSize = 18; const double _kIconSize = 18;
const double _kDividerIndent = 10; const double _kDividerIndent = 10;
const double _kAddIconSize = _kTabBarHeight - 15; const double _kAddIconSize = _kTabBarHeight - 15;
@ -55,17 +54,16 @@ class DesktopTabBar extends StatelessWidget {
offstage: !mainTab, offstage: !mainTab,
child: Row(children: [ child: Row(children: [
Image.asset('assets/logo.ico'), Image.asset('assets/logo.ico'),
Text("RustDesk"), Text("RustDesk").paddingOnly(left: 5),
]).paddingSymmetric(horizontal: 12, vertical: 5), ]).paddingSymmetric(horizontal: 12, vertical: 5),
), ),
Flexible( Flexible(
child: Obx(() => TabBar( child: Obx(() => TabBar(
indicator: BoxDecoration(), indicatorColor: _theme.indicatorColor,
indicatorColor: Colors.transparent,
labelPadding: const EdgeInsets.symmetric( labelPadding: const EdgeInsets.symmetric(
vertical: 0, horizontal: 0), vertical: 0, horizontal: 0),
isScrollable: true, isScrollable: true,
indicatorWeight: 0.1, indicatorPadding: EdgeInsets.only(bottom: 2),
physics: BouncingScrollPhysics(), physics: BouncingScrollPhysics(),
controller: controller.value, controller: controller.value,
tabs: tabs.asMap().entries.map((e) { tabs: tabs.asMap().entries.map((e) {
@ -179,42 +177,45 @@ class _Tab extends StatelessWidget {
bool is_selected = index == selected; bool is_selected = index == selected;
bool show_divider = index != selected - 1 && index != selected; bool show_divider = index != selected - 1 && index != selected;
return Ink( return Ink(
width: _kTabFixedWidth,
child: InkWell( child: InkWell(
onHover: (hover) => _hover.value = hover, onHover: (hover) => _hover.value = hover,
onTap: () => onSelected(), onTap: () => onSelected(),
child: Row( child: Row(
children: [ children: [
Expanded( Tab(
child: Tab( child: Row(
key: this.key, crossAxisAlignment: CrossAxisAlignment.center,
child: Row( children: [
crossAxisAlignment: CrossAxisAlignment.center, Row(
children: [ mainAxisAlignment: MainAxisAlignment.center,
Icon( children: [
icon, Icon(
size: _kIconSize, icon,
color: is_selected size: _kIconSize,
? theme.selectedtabIconColor color: is_selected
: theme.unSelectedtabIconColor, ? theme.selectedtabIconColor
).paddingSymmetric(horizontal: 5), : theme.unSelectedtabIconColor,
Expanded( ).paddingOnly(right: 5),
child: Text( Text(
translate(label), translate(label),
style: TextStyle( textAlign: TextAlign.center,
color: is_selected style: TextStyle(
? theme.selectedTextColor color: is_selected
: theme.unSelectedTextColor), ? theme.selectedTextColor
), : theme.unSelectedTextColor),
), ),
Obx((() => _CloseButton( ],
visiable: _hover.value && closable, ),
tabSelected: is_selected, Offstage(
onClose: () => onClose(), offstage: !closable,
theme: theme, child: Obx((() => _CloseButton(
))), visiable: _hover.value,
])), tabSelected: is_selected,
), onClose: () => onClose(),
theme: theme,
))),
)
])).paddingSymmetric(horizontal: 10),
Offstage( Offstage(
offstage: !show_divider, offstage: !show_divider,
child: VerticalDivider( child: VerticalDivider(
@ -289,7 +290,7 @@ class _CloseButton extends StatelessWidget {
: theme.unSelectedIconColor, : theme.unSelectedIconColor,
), ),
), ),
)).paddingSymmetric(horizontal: 5); )).paddingOnly(left: 5);
} }
} }
@ -301,6 +302,7 @@ class _Theme {
late Color selectedIconColor; late Color selectedIconColor;
late Color unSelectedIconColor; late Color unSelectedIconColor;
late Color dividerColor; late Color dividerColor;
late Color indicatorColor;
_Theme.light() { _Theme.light() {
unSelectedtabIconColor = Color.fromARGB(255, 162, 203, 241); unSelectedtabIconColor = Color.fromARGB(255, 162, 203, 241);
@ -310,6 +312,7 @@ class _Theme {
selectedIconColor = Color.fromARGB(255, 26, 26, 26); selectedIconColor = Color.fromARGB(255, 26, 26, 26);
unSelectedIconColor = Color.fromARGB(255, 96, 96, 96); unSelectedIconColor = Color.fromARGB(255, 96, 96, 96);
dividerColor = Color.fromARGB(255, 238, 238, 238); dividerColor = Color.fromARGB(255, 238, 238, 238);
indicatorColor = MyTheme.accent;
} }
_Theme.dark() { _Theme.dark() {
@ -320,5 +323,6 @@ class _Theme {
selectedIconColor = Color.fromARGB(255, 215, 215, 215); selectedIconColor = Color.fromARGB(255, 215, 215, 215);
unSelectedIconColor = Color.fromARGB(255, 255, 255, 255); unSelectedIconColor = Color.fromARGB(255, 255, 255, 255);
dividerColor = Color.fromARGB(255, 64, 64, 64); dividerColor = Color.fromARGB(255, 64, 64, 64);
indicatorColor = MyTheme.accent;
} }
} }