chore: update image node widget example

This commit is contained in:
Lucas.Xu 2022-07-13 20:28:07 +08:00
parent 085cc73ec5
commit d07854ebb4

View File

@ -8,68 +8,71 @@ class ImageNodeBuilder extends NodeWidgetBuilder {
required super.editorState, required super.editorState,
}) : super.create(); }) : super.create();
@override
Widget build(BuildContext buildContext) {
return _ImageNodeWidget(
node: node,
editorState: editorState,
);
}
}
class _ImageNodeWidget extends StatelessWidget {
final Node node;
final EditorState editorState;
const _ImageNodeWidget({
Key? key,
required this.node,
required this.editorState,
}) : super(key: key);
String get src => node.attributes['image_src'] as String; String get src => node.attributes['image_src'] as String;
@override @override
Widget build(BuildContext buildContext) { Widget build(BuildContext context) {
// Future.delayed(const Duration(seconds: 5), () {
// node.updateAttributes({
// 'image_src':
// "https://images.pexels.com/photos/9995076/pexels-photo-9995076.png?cs=srgb&dl=pexels-temmuz-uzun-9995076.jpg&fm=jpg&w=640&h=400"
// });
// });
return GestureDetector( return GestureDetector(
child: ChangeNotifierProvider.value( child: ChangeNotifierProvider.value(
value: node, value: node,
builder: (context, child) { builder: (_, __) => Consumer<Node>(
return Consumer<Node>( builder: ((context, value, child) => _build(context)),
builder: (context, value, child) { ),
return _build(context);
},
);
},
), ),
onTap: () { onTap: () {
const newImageSrc = editorState.update(
"https://images.pexels.com/photos/9995076/pexels-photo-9995076.png?cs=srgb&dl=pexels-temmuz-uzun-9995076.jpg&fm=jpg&w=640&h=400"; node,
final newAttribute = Attributes.from(node.attributes) Attributes.from(node.attributes)
..update( ..addAll(
'image_src', {
(value) => newImageSrc, 'image_src':
); "https://images.pexels.com/photos/9995076/pexels-photo-9995076.png?cs=srgb&dl=pexels-temmuz-uzun-9995076.jpg&fm=jpg&w=640&h=400",
editorState.update(node, newAttribute); },
),
);
}, },
); );
} }
Widget _build(BuildContext buildContext) { Widget _build(BuildContext context) {
final image = Image.network(src); return Column(
Widget? children; children: [
if (node.children.isNotEmpty) { Image.network(src),
children = Column( if (node.children.isNotEmpty)
crossAxisAlignment: CrossAxisAlignment.start, Column(
children: node.children crossAxisAlignment: CrossAxisAlignment.start,
.map( children: node.children
(e) => renderPlugins.buildWidget( .map(
context: NodeWidgetContext( (e) => editorState.renderPlugins.buildWidget(
buildContext: buildContext, context: NodeWidgetContext(
node: e, buildContext: context,
editorState: editorState, node: e,
), editorState: editorState,
), ),
) ),
.toList(), )
); .toList(),
} ),
if (children != null) { ],
return Column( );
children: [
image,
children,
],
);
} else {
return image;
}
} }
} }