halkyon-days/appflowy-editor
Watch
1
0
Fork
You've already forked appflowy-editor
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: support customizing max width

Browse source
This commit is contained in:
Lucas.Xu 2024-09-18 13:49:41 +08:00
commit 0a0154ff7d
3 changed files with 25 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

3
example/lib/pages/desktop_editor.dart
View file

@ -129,7 +129,8 @@ class _DesktopEditorState extends State<DesktopEditor> {
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
), ),
), ),
padding: const EdgeInsets.symmetric(horizontal: 200.0), padding: const EdgeInsets.symmetric(horizontal: 40),
maxWidth: 640,
); );
} }

21
lib/src/editor/editor_component/entry/page_block_component.dart
View file

@ -63,7 +63,11 @@ class PageBlockComponent extends BlockComponentStatelessWidget {
children: [ children: [
if (header != null) header!, if (header != null) header!,
...items.map( ...items.map(
(e) => Padding( (e) => Container(
constraints: BoxConstraints(
maxWidth:
editorState.editorStyle.maxWidth ?? double.infinity,
),
padding: editorState.editorStyle.padding, padding: editorState.editorStyle.padding,
child: editorState.renderer.build(context, e), child: editorState.renderer.build(context, e),
), ),
@ -97,11 +101,16 @@ class PageBlockComponent extends BlockComponentStatelessWidget {
); );
} }
return Padding( return Center(
padding: editorState.editorStyle.padding, child: Container(
child: editorState.renderer.build( constraints: BoxConstraints(
context, maxWidth: editorState.editorStyle.maxWidth ?? double.infinity,
items[index - (header != null ? 1 : 0)], ),
padding: editorState.editorStyle.padding,
child: editorState.renderer.build(
context,
items[index - (header != null ? 1 : 0)],
),
), ),
); );
}, },

8
lib/src/editor/editor_component/style/editor_style.dart
View file

@ -21,11 +21,15 @@ class EditorStyle {
this.defaultTextDirection, this.defaultTextDirection,
this.enableHapticFeedbackOnAndroid = true, this.enableHapticFeedbackOnAndroid = true,
this.textScaleFactor = 1.0, this.textScaleFactor = 1.0,
this.maxWidth,
}); });
// The padding of the editor. // The padding of the editor.
final EdgeInsets padding; final EdgeInsets padding;
// The max width of the editor.
final double? maxWidth;
// The cursor color // The cursor color
final Color cursorColor; final Color cursorColor;
@ -82,6 +86,7 @@ class EditorStyle {
this.defaultTextDirection, this.defaultTextDirection,
this.cursorWidth = 2.0, this.cursorWidth = 2.0,
this.textScaleFactor = 1.0, this.textScaleFactor = 1.0,
this.maxWidth,
}) : padding = padding ?? const EdgeInsets.symmetric(horizontal: 100), }) : padding = padding ?? const EdgeInsets.symmetric(horizontal: 100),
cursorColor = cursorColor ?? const Color(0xFF00BCF0), cursorColor = cursorColor ?? const Color(0xFF00BCF0),
selectionColor = selectionColor =
@ -112,6 +117,7 @@ class EditorStyle {
this.cursorWidth = 2.0, this.cursorWidth = 2.0,
this.enableHapticFeedbackOnAndroid = true, this.enableHapticFeedbackOnAndroid = true,
this.textScaleFactor = 1.0, this.textScaleFactor = 1.0,
this.maxWidth,
}) : padding = padding ?? const EdgeInsets.symmetric(horizontal: 20), }) : padding = padding ?? const EdgeInsets.symmetric(horizontal: 20),
cursorColor = cursorColor ?? const Color(0xFF00BCF0), cursorColor = cursorColor ?? const Color(0xFF00BCF0),
dragHandleColor = dragHandleColor ?? const Color(0xFF00BCF0), dragHandleColor = dragHandleColor ?? const Color(0xFF00BCF0),
@ -138,6 +144,7 @@ class EditorStyle {
bool? enableHapticFeedbackOnAndroid, bool? enableHapticFeedbackOnAndroid,
double? cursorWidth, double? cursorWidth,
double? textScaleFactor, double? textScaleFactor,
double? maxWidth,
}) { }) {
return EditorStyle( return EditorStyle(
padding: padding ?? this.padding, padding: padding ?? this.padding,
@ -157,6 +164,7 @@ class EditorStyle {
enableHapticFeedbackOnAndroid ?? this.enableHapticFeedbackOnAndroid, enableHapticFeedbackOnAndroid ?? this.enableHapticFeedbackOnAndroid,
cursorWidth: cursorWidth ?? this.cursorWidth, cursorWidth: cursorWidth ?? this.cursorWidth,
textScaleFactor: textScaleFactor ?? this.textScaleFactor, textScaleFactor: textScaleFactor ?? this.textScaleFactor,
maxWidth: maxWidth ?? this.maxWidth,
); );
} }
} }