mirror of
https://github.com/AppFlowy-IO/AppFlowy.git
synced 2024-09-11 19:17:43 +03:00
fix: minor UI issues (#5253)
* fix: the desktop cover didn't sync with the mobile cover * fix: remove unnecessary space when editing the title * fix: recent view border issue * fix: double focus on the title and doc
This commit is contained in:
parent
554c821db9
commit
22e89fd197
@ -50,7 +50,26 @@ class MobileRecentView extends StatelessWidget {
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Expanded(
|
||||
Expanded(child: _buildCover(context, state)),
|
||||
Expanded(child: _buildTitle(context, state)),
|
||||
],
|
||||
),
|
||||
),
|
||||
Align(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: _buildIcon(context, state),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildCover(BuildContext context, RecentViewState state) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(top: 1.0, left: 1.0, right: 1.0),
|
||||
child: ClipRRect(
|
||||
borderRadius: const BorderRadius.only(
|
||||
topLeft: Radius.circular(8),
|
||||
@ -62,9 +81,11 @@ class MobileRecentView extends StatelessWidget {
|
||||
value: state.coverValue,
|
||||
),
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: Padding(
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildTitle(BuildContext context, RecentViewState state) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.fromLTRB(8, 18, 8, 2),
|
||||
// hack: minLines currently not supported in Text widget.
|
||||
// https://github.com/flutter/flutter/issues/31134
|
||||
@ -72,6 +93,7 @@ class MobileRecentView extends StatelessWidget {
|
||||
children: [
|
||||
FlowyText.medium(
|
||||
view.name,
|
||||
fontSize: 16.0,
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
@ -81,14 +103,11 @@ class MobileRecentView extends StatelessWidget {
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
Align(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: Padding(
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildIcon(BuildContext context, RecentViewState state) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(left: 8.0),
|
||||
child: state.icon.isNotEmpty
|
||||
? EmojiText(
|
||||
@ -99,13 +118,6 @@ class MobileRecentView extends StatelessWidget {
|
||||
dimension: 32.0,
|
||||
child: view.defaultIcon(),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
@ -3,6 +3,7 @@ import 'dart:io';
|
||||
import 'package:appflowy/mobile/application/page_style/document_page_style_bloc.dart';
|
||||
import 'package:appflowy/plugins/base/emoji/emoji_picker_screen.dart';
|
||||
import 'package:appflowy/plugins/base/icon/icon_picker.dart';
|
||||
import 'package:appflowy/plugins/document/application/prelude.dart';
|
||||
import 'package:appflowy/plugins/document/presentation/editor_plugins/base/build_context_extension.dart';
|
||||
import 'package:appflowy/plugins/document/presentation/editor_plugins/cover/document_immersive_cover_bloc.dart';
|
||||
import 'package:appflowy/plugins/document/presentation/editor_plugins/header/emoji_icon_widget.dart';
|
||||
@ -12,6 +13,7 @@ import 'package:appflowy/workspace/application/settings/appearance/base_appearan
|
||||
import 'package:appflowy/workspace/application/view/view_bloc.dart';
|
||||
import 'package:appflowy_backend/protobuf/flowy-folder/view.pb.dart';
|
||||
import 'package:appflowy_backend/protobuf/flowy-user/protobuf.dart';
|
||||
import 'package:appflowy_editor/appflowy_editor.dart';
|
||||
import 'package:flowy_infra/theme_extension.dart';
|
||||
import 'package:flowy_infra_ui/flowy_infra_ui.dart';
|
||||
import 'package:flowy_infra_ui/widget/ignore_parent_gesture.dart';
|
||||
@ -40,11 +42,23 @@ class DocumentImmersiveCover extends StatefulWidget {
|
||||
class _DocumentImmersiveCoverState extends State<DocumentImmersiveCover> {
|
||||
final textEditingController = TextEditingController();
|
||||
final scrollController = ScrollController();
|
||||
final focusNode = FocusNode();
|
||||
|
||||
late PropertyValueNotifier<Selection?>? selectionNotifier =
|
||||
context.read<DocumentBloc>().state.editorState?.selectionNotifier;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
selectionNotifier?.addListener(_unfocus);
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
textEditingController.dispose();
|
||||
scrollController.dispose();
|
||||
selectionNotifier?.removeListener(_unfocus);
|
||||
focusNode.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@ -121,6 +135,7 @@ class _DocumentImmersiveCoverState extends State<DocumentImmersiveCover> {
|
||||
}
|
||||
return TextField(
|
||||
controller: textEditingController,
|
||||
focusNode: focusNode,
|
||||
decoration: const InputDecoration(
|
||||
border: InputBorder.none,
|
||||
enabledBorder: InputBorder.none,
|
||||
@ -225,4 +240,11 @@ class _DocumentImmersiveCoverState extends State<DocumentImmersiveCover> {
|
||||
width: double.infinity,
|
||||
);
|
||||
}
|
||||
|
||||
void _unfocus() {
|
||||
final selection = selectionNotifier?.value;
|
||||
if (selection != null) {
|
||||
focusNode.unfocus(disposition: UnfocusDisposition.previouslyFocusedChild);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -1,9 +1,6 @@
|
||||
import 'dart:async';
|
||||
import 'dart:io';
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
|
||||
import 'package:appflowy/plugins/document/application/document_bloc.dart';
|
||||
import 'package:appflowy/plugins/document/presentation/editor_plugins/mobile_toolbar_v3/aa_menu/_close_keyboard_or_menu_button.dart';
|
||||
import 'package:appflowy/plugins/document/presentation/editor_plugins/mobile_toolbar_v3/aa_menu/_toolbar_theme.dart';
|
||||
@ -12,6 +9,8 @@ import 'package:appflowy/plugins/document/presentation/editor_plugins/mobile_too
|
||||
import 'package:appflowy_editor/appflowy_editor.dart';
|
||||
import 'package:collection/collection.dart';
|
||||
import 'package:flowy_infra_ui/flowy_infra_ui.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
@ -76,7 +75,10 @@ class _AppFlowyMobileToolbarState extends State<AppFlowyMobileToolbar> {
|
||||
builder: (context, isKeyboardShow, __) {
|
||||
return AnimatedContainer(
|
||||
duration: const Duration(milliseconds: 110),
|
||||
height: isKeyboardShow ? widget.toolbarHeight : 0,
|
||||
// only adding padding when the keyboard is triggered by editor
|
||||
height: isKeyboardShow && widget.editorState.selection != null
|
||||
? widget.toolbarHeight
|
||||
: 0,
|
||||
);
|
||||
},
|
||||
),
|
||||
|
Loading…
Reference in New Issue
Block a user