flutter 自定义控件RenderObjectWidget使用
CustomWidget的自定义组件的注释还是比较清晰的。
·
CustomWidget的自定义组件的注释还是比较清晰的
参考文档Flutter实战
import 'package:flutter/cupertino.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
/*
* 如果组件不会包含子组件,则我们可以直接继承自 LeafRenderObjectWidget ,它是 RenderObjectWidget
* LeafRenderObjectWidget 适用于 没有子 Widget 的 RenderObject(例如 Container)。
* */
class CustomWidget extends LeafRenderObjectWidget{
//创建RenderObjec,返回 RenderObject
RenderObject createRenderObject(BuildContext context) {
// TODO: implement createRenderObject
return RenderCustomObject();
}
//更新RenderObj
void updateRenderObject(BuildContext context, covariant RenderObject renderObject) {
// TODO: implement updateRenderObject
super.updateRenderObject(context, renderObject);
}
LeafRenderObjectElement createElement() {
// TODO: implement createElement
return super.createElement();
}
}
//RenderBox 是 Flutter 最常见的渲染对象,用于 布局 和 绘制
//画个红色的盒子
class RenderCustomObject extends RenderBox{
Color color = Colors.red;
//实现布局逻辑
void performLayout() {
// TODO: implement performLayout
size = const Size(100, 100);
}
//实现绘制,绘制内容
void paint(PaintingContext context, Offset offset) {
// TODO: implement paint
final paint = Paint()..color = color;
context.canvas.drawRect(offset & size, paint);
}
//允许点击事件命中当前控件,拦截响应链上的响应
bool hitTestSelf(Offset position) {
// TODO: implement hitTestSelf
return true;
}
//处理点击事件,监听点击事件,改变颜色,并调用 markNeedsPaint() 触发重绘
void handleEvent(PointerEvent event, HitTestEntry entry) {
if (event is PointerDownEvent) {
color = color == Colors.blue ? Colors.green : Colors.blue;
markNeedsPaint(); // 重新绘制
}
}
}
魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。
更多推荐

所有评论(0)