Add placeholder (hint text) functionality

pull/34/head
singerdmx 4 years ago
parent bafda1f340
commit 76ae6dedc6
  1. 474
      app/assets/sample_data.json
  2. 9
      lib/widgets/default_styles.dart
  3. 3
      lib/widgets/editor.dart
  4. 7
      lib/widgets/raw_editor.dart

@ -1,478 +1,4 @@
[
{
"insert":"Flutter Quill"
},
{
"attributes":{
"header":1
},
"insert":"\n"
},
{
"insert": {
"image": "https://user-images.githubusercontent.com/122956/72955931-ccc07900-3d52-11ea-89b1-d468a6e2aa2b.png"
},
"attributes":{
"width":"230",
"style":"display: block; margin: auto;"
}
},
{
"insert":"\nRich text editor for Flutter"
},
{
"attributes":{
"header":2
},
"insert":"\n"
},
{
"insert":"Quill component for Flutter"
},
{
"attributes":{
"header":3
},
"insert":"\n"
},
{
"insert":"This "
},
{
"attributes":{
"italic":true,
"background":"transparent"
},
"insert":"library"
},
{
"insert":" supports "
},
{
"attributes":{
"bold":true,
"background":"#ebd6ff"
},
"insert":"mobile"
},
{
"insert":" platform "
},
{
"attributes":{
"underline":true,
"bold":true,
"color":"#e60000"
},
"insert":"only"
},
{
"attributes":{
"color":"rgba(0, 0, 0, 0.847)"
},
"insert":" and "
},
{
"attributes":{
"strike":true,
"color":"black"
},
"insert":"web"
},
{
"insert":" is not supported.\nYou are welcome to use "
},
{
"attributes":{
"link":"https://bulletjournal.us/home/index.html"
},
"insert":"Bullet Journal"
},
{
"insert":":\nTrack personal and group journals (ToDo, Note, Ledger) from multiple views with timely reminders"
},
{
"attributes":{
"list":"ordered"
},
"insert":"\n"
},
{
"insert":"Share your tasks and notes with teammates, and see changes as they happen in real-time, across all devices"
},
{
"attributes":{
"list":"ordered"
},
"insert":"\n"
},
{
"insert":"Check out what you and your teammates are working on each day"
},
{
"attributes":{
"list":"ordered"
},
"insert":"\n"
},
{
"insert":"\nSplitting bills with friends can never be easier."
},
{
"attributes":{
"list":"bullet"
},
"insert":"\n"
},
{
"insert":"Start creating a group and invite your friends to join."
},
{
"attributes":{
"list":"bullet"
},
"insert":"\n"
},
{
"insert":"Create a BuJo of Ledger type to see expense or balance summary."
},
{
"attributes":{
"list":"bullet"
},
"insert":"\n"
},
{
"insert":"\nAttach one or multiple labels to tasks, notes or transactions. Later you can track them just using the label(s)."
},
{
"attributes":{
"blockquote":true
},
"insert":"\n"
},
{
"insert":"\nvar BuJo = 'Bullet' + 'Journal'"
},
{
"attributes":{
"code-block":true
},
"insert":"\n"
},
{
"insert":"\nStart tracking in your browser"
},
{
"attributes":{
"indent":1
},
"insert":"\n"
},
{
"insert":"Stop the timer on your phone"
},
{
"attributes":{
"indent":1
},
"insert":"\n"
},
{
"insert":"All your time entries are synced"
},
{
"attributes":{
"indent":2
},
"insert":"\n"
},
{
"insert":"between the phone apps"
},
{
"attributes":{
"indent":2
},
"insert":"\n"
},
{
"insert":"and the website."
},
{
"attributes":{
"indent":3
},
"insert":"\n"
},
{
"insert":"\n"
},
{
"insert":"\nCenter Align"
},
{
"attributes":{
"align":"center"
},
"insert":"\n"
},
{
"insert":"Right Align"
},
{
"attributes":{
"align":"right"
},
"insert":"\n"
},
{
"insert":"Justify Align"
},
{
"attributes":{
"align":"justify"
},
"insert":"\n"
},
{
"insert":"Have trouble finding things? "
},
{
"attributes":{
"list":"ordered"
},
"insert":"\n"
},
{
"insert":"Just type in the search bar"
},
{
"attributes":{
"indent":1,
"list":"ordered"
},
"insert":"\n"
},
{
"insert":"and easily find contents"
},
{
"attributes":{
"indent":2,
"list":"ordered"
},
"insert":"\n"
},
{
"insert":"across projects or folders."
},
{
"attributes":{
"indent":2,
"list":"ordered"
},
"insert":"\n"
},
{
"insert":"It matches text in your note or task."
},
{
"attributes":{
"indent":1,
"list":"ordered"
},
"insert":"\n"
},
{
"insert":"Enable reminders so that you will get notified by"
},
{
"attributes":{
"list":"ordered"
},
"insert":"\n"
},
{
"insert":"email"
},
{
"attributes":{
"indent":1,
"list":"ordered"
},
"insert":"\n"
},
{
"insert":"message on your phone"
},
{
"attributes":{
"indent":1,
"list":"ordered"
},
"insert":"\n"
},
{
"insert":"popup on the web site"
},
{
"attributes":{
"indent":1,
"list":"ordered"
},
"insert":"\n"
},
{
"insert":"Create a BuJo serving as project or folder"
},
{
"attributes":{
"list":"bullet"
},
"insert":"\n"
},
{
"insert":"Organize your"
},
{
"attributes":{
"indent":1,
"list":"bullet"
},
"insert":"\n"
},
{
"insert":"tasks"
},
{
"attributes":{
"indent":2,
"list":"bullet"
},
"insert":"\n"
},
{
"insert":"notes"
},
{
"attributes":{
"indent":2,
"list":"bullet"
},
"insert":"\n"
},
{
"insert":"transactions"
},
{
"attributes":{
"indent":2,
"list":"bullet"
},
"insert":"\n"
},
{
"insert":"under BuJo "
},
{
"attributes":{
"indent":3,
"list":"bullet"
},
"insert":"\n"
},
{
"insert":"See them in Calendar"
},
{
"attributes":{
"list":"bullet"
},
"insert":"\n"
},
{
"insert":"or hierarchical view"
},
{
"attributes":{
"indent":1,
"list":"bullet"
},
"insert":"\n"
},
{
"insert": "this is a check list"
},
{
"attributes": {
"list": "checked"
},
"insert": "\n"
},
{
"insert": "this is a uncheck list"
},
{
"attributes": {
"list": "unchecked"
},
"insert": "\n"
},
{
"insert": "Font "
},
{
"attributes": {
"font": "sans-serif"
},
"insert": "Sans Serif"
},
{
"insert": " "
},
{
"attributes": {
"font": "serif"
},
"insert": "Serif"
},
{
"insert": " "
},
{
"attributes": {
"font": "monospace"
},
"insert": "Monospace"
},
{
"insert": " Size "
},
{
"attributes": {
"size": "small"
},
"insert": "Small"
},
{
"insert": " "
},
{
"attributes": {
"size": "large"
},
"insert": "Large"
},
{
"insert": " "
},
{
"attributes": {
"size": "huge"
},
"insert": "Huge"
},
{
"insert": "\n"
}

@ -54,6 +54,7 @@ class DefaultStyles {
final TextStyle sizeLarge; // 'large'
final TextStyle sizeHuge; // 'huge'
final TextStyle link;
final DefaultTextBlockStyle placeHolder;
final DefaultTextBlockStyle lists;
final DefaultTextBlockStyle quote;
final DefaultTextBlockStyle code;
@ -70,6 +71,7 @@ class DefaultStyles {
this.underline,
this.strikeThrough,
this.link,
this.placeHolder,
this.lists,
this.quote,
this.code,
@ -144,6 +146,12 @@ class DefaultStyles {
color: themeData.accentColor,
decoration: TextDecoration.underline,
),
placeHolder: DefaultTextBlockStyle(
defaultTextStyle.style.copyWith(
fontSize: 20.0,
height: 1.5,
color: Colors.grey.withOpacity(0.6),
), Tuple2(0.0, 0.0), Tuple2(0.0, 0.0), null),
lists: DefaultTextBlockStyle(
baseStyle, baseSpacing, Tuple2(0.0, 6.0), null),
quote: DefaultTextBlockStyle(
@ -188,6 +196,7 @@ class DefaultStyles {
underline: other.underline ?? this.underline,
strikeThrough: other.strikeThrough ?? this.strikeThrough,
link: other.link ?? this.link,
placeHolder: other.placeHolder ?? this.placeHolder,
lists: other.lists ?? this.lists,
quote: other.quote ?? this.quote,
code: other.code ?? this.code,

@ -359,6 +359,9 @@ class _QuillEditorSelectionGestureDetectorBuilder
}
bool _onTapping(TapUpDetails details) {
if (_state.widget.controller.document.isEmpty()) {
return false;
}
TextPosition pos =
getRenderEditor().getPositionForOffset(details.globalPosition);
containerNode.ChildQuery result =

@ -504,6 +504,9 @@ class RawEditorState extends EditorState
super.build(context);
Document _doc = widget.controller.document;
if (_doc.isEmpty() && !widget.focusNode.hasFocus) {
_doc = Document()..insert(0, 'Place Holder');
}
Widget child = CompositedTransformTarget(
link: _toolbarLayerLink,
@ -696,6 +699,10 @@ class RawEditorState extends EditorState
? defaultStyles.merge(parentStyles)
: defaultStyles;
if (widget.controller.document.isEmpty()) {
_styles.merge(DefaultStyles(paragraph: defaultStyles.placeHolder));
}
if (widget.customStyles != null) {
_styles = _styles.merge(widget.customStyles);
}

Loading…
Cancel
Save