lazy_widget 2.0.0 lazy_widget: ^2.0.0 copied to clipboard
A new Flutter package.
import 'package:flutter/material.dart';
import 'package:flutter_html/flutter_html.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:lazy_widget/lazy_widget.dart';
import 'package:simple_html_css/simple_html_css.dart';
import 'three_stooges.dart';
///
import 'package:cached_network_image/cached_network_image.dart';
void main() {
ImageWidgetComponent.init(svgWidgetBuilder: (iv) {
try {
return SvgPicture.asset(
iv.url ?? '',
color: iv.color,
package: iv.package,
fit: iv.fit ?? BoxFit.contain,
semanticsLabel: 'A red up arrow',
);
} catch (e) {
return Text("svgWidgetBuilder error = $e");
}
}, errorBuilder: (iv) {
// return SizedBox(
// child: Icon(
// Icons.error_outline,
// color: Colors.red,
// ),
// width: iv.width,
// height: iv.height,
// );
}, netWorkWidgetBuilder: (iv) {
return CachedNetworkImage(
imageUrl: iv.url ?? '',
width: iv.width,
height: iv.height,
fit: iv.fit,
placeholder: (context, url) => const CircularProgressIndicator(),
errorWidget: (context, url, error) => Column(
children: [
Icon(
Icons.error,
color: Colors.amber,
),
Text(
error.toString(),
style: TextStyle(color: Colors.white60),
)
],
),
);
});
runApp(MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
// This is the theme of your application.
//
// Try running your application with "flutter run". You'll see the
// application has a blue toolbar. Then, without quitting the app, try
// changing the primarySwatch below to Colors.green and then invoke
// "hot reload" (press "r" in the console where you ran "flutter run",
// or simply save your changes to "hot reload" in a Flutter IDE).
// Notice that the counter didn't reset back to zero; the application
// is not restarted.
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key, this.title = ""}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
void _incrementCounter() {
setState(() {
_counter++;
});
}
var imgUrl =
"https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_92x30dp.png";
@override
Widget build(BuildContext context) {
var textWidget = TextWidget(
"Flutter",
visible: !false,
backgroundColor: Colors.blue,
radius: 5,
isClipOval: true,
width: 50,
height: 50,
alignment: Alignment.center,
margin: EdgeInsets.all(10),
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: const Text('A SnackBar has been shown.')),
);
},
);
TextWidget.childTransformBuilder = (TextWidget child) {
var textTrim = child.text?.trim() ?? '';
if (textTrim.startsWith('<') && textTrim.endsWith('>')) {
// return HTML.toRichText(context, child.text ?? '',
// defaultTextStyle: child.style);
// Size boundingTextSize(String text,
// {int maxLines = 2 ^ 31, double maxWidth = double.infinity}) {
// if (text == null || text.isEmpty) {
// return Size.zero;
// }
// final TextPainter textPainter = TextPainter(
// textDirection: TextDirection.ltr,
// text: TextSpan(text: text, style: Theme.of(context).textTheme.labelLarge.height),
// maxLines: maxLines)
// ..layout(maxWidth: maxWidth);
// return textPainter.size;
// }
// var size = boundingTextSize(child.text!);
var defaultTextStyle = DefaultTextStyle.of(context).style;
var fontSize = child.style?.fontSize ?? 14;
var height =
child.style?.height ?? defaultTextStyle.height ?? (fontSize * 1.5);
print("fontSize=$fontSize height=$height");
return Html(data: child.text, style: {
// tables will have the below background color
"html": Style(
padding: EdgeInsets.zero,
margin: EdgeInsets.zero,
height: height,
fontSize: FontSize(fontSize),
),
"body": Style(
padding: EdgeInsets.zero,
margin: EdgeInsets.zero,
height: height,
fontSize: FontSize(fontSize),
),
"span": Style(
padding: EdgeInsets.zero,
margin: EdgeInsets.zero,
height: height,
fontSize: FontSize(fontSize),
),
"p": Style(
padding: EdgeInsets.zero,
margin: EdgeInsets.zero,
height: height,
fontSize: FontSize(fontSize),
),
});
}
return null;
};
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Column(
children: [
Container(
color: Colors.red,
child: TextWidget(
// '''<html style=margin:0;>CSS Sdfasd根深蒂固Jjf
// <span style='color:dodgerblue;background-color:lightseagreen;padding:0'>CSS</span>
// </html>
// ''',
'''<p>CSS Sdfasdf
<span style='color:dodgerblue;background-color:lightseagreen'>CSS</span>
</p>
''',
// style: const TextStyle(fontSize: 12),
// style: const TextStyle(fontSize: 22),
alignment: Alignment.centerLeft,
),
),
Container(
color: Colors.yellow,
child: TextWidget(
"CSS",
// style: const TextStyle(fontSize: 12),
// style: const TextStyle(fontSize: 22),
alignment: Alignment.centerLeft,
),
)
],
),
);
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: SingleChildScrollView(
child: Center(
child: Column(
children: <Widget>[
TextWidget(
"$textWidget",
maxLines: 6,
alignment: Alignment.center,
backgroundColor: Colors.yellow,
),
SizedBox(height: 20),
Container(
color: Colors.black,
child: TextWidget(
"Flutter",
visible: !false,
backgroundColor: Colors.green,
radius: 5,
isClipOval: true,
width: 50,
height: 50,
// alignment: Alignment.center,
margin: EdgeInsets.all(10),
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: const Text('A SnackBar has been shown.')),
);
},
)),
SizedBox(height: 20),
Container(
color: Colors.black,
child: TextWidget(
"Flutter 是 Google推出并开源的移动应用开发框架"
",主打跨平台、高保真、高性能。开发者可以通过 Dart语言开发 App,"
"一套代码同时运行在 iOS 和 Android平台。 Flutter提供了丰富的组件、"
"接口,开发者可以很快地为 Flutter添加 native扩展。同时 Flutter还使用 Native引擎渲染视图,这无疑能为用户提供良好的体验。",
visible: !false,
maxLines: 3,
backgroundColor: Colors.blue,
radius: 5,
// isClipOval: true,
// width: 50,
// width: double.infinity,
height: 110,
// textAlign: TextAlign.center,
// alignment: Alignment.center,
margin: EdgeInsets.all(10),
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: const Text('A SnackBar has been shown.')),
);
},
)),
Container(
color: Colors.black,
margin: EdgeInsets.all(20),
child: ImageWidget(
imgUrl,
)),
TextWidget('''<body>
<h5 style=''>Convert your <span style='color:lightseagreen;'>
HTML</span> and <span style='color:dodgerblue'>CSS</span>
easily into RichText</h5>
</body>
'''),
TextWidget('''<body>
<span>"巴拉巴拉 <span class=\"keyword-red\">收到</span><span class=\"keyword-red\">是是是</span></body>
'''),
Html(data: '''
<div class="s-course-info-sub white-space-2" style="-webkit-box-orient: vertical;"> 巴拉巴拉《<span class="keyword-red">哈哈哈哈</span>》空你几哇阿斯顿发 </div>
'''),
Html(data: '''Sdfasdf
<span style='color:dodgerblue;background-color:lightseagreen'>CSS</span>
''', style: {
// tables will have the below background color
"span": Style(
fontSize: const FontSize(22),
),
}),
TextWidget(
'''<body>Sdfasdf
<span style='color:dodgerblue;background-color:lightseagreen'>CSS</span>
</body>
''',
style: const TextStyle(fontSize: 22),
alignment: Alignment.centerLeft,
),
TextWidget(
'''<p>Sdfasdf
<span style='margin:0;color:dodgerblue;background-color:lightseagreen'>CSS</span>
</p>
''',
style: const TextStyle(fontSize: 22),
alignment: Alignment.centerLeft,
),
Container(
color: Colors.red,
child: TextWidget(
'''<html style=margin:0;>Sdfasd根深蒂固Jjf
<span style='color:dodgerblue;background-color:lightseagreen;padding:0'>CSS</span>
</html>
''',
style: const TextStyle(fontSize: 22),
alignment: Alignment.centerLeft,
),
),
Container(
color: Colors.yellow,
child: TextWidget(
"CSS",
style: const TextStyle(fontSize: 22),
alignment: Alignment.centerLeft,
),
),
Container(
color: Colors.black,
margin: const EdgeInsets.all(20),
child: ImageWidget(
"https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/719a920e0e5746f9bf96481ee0f7a7c8~tplv-k3u1fbpfcp-no-mark:240:240:240:160.awebp?",
width: 100,
height: 100,
isClipOval: true,
)),
Container(
color: Colors.black,
width: 300,
height: 10,
),
Container(
color: Colors.amber,
child: TextWidget(
"TextWidget.fromOnly",
backgroundColor: Colors.greenAccent,
).buildOnly(
left: Icon(Icons.chevron_left),
top: Icon(Icons.vertical_align_top),
right: Icon(Icons.recommend),
bottom: Icon(Icons.vertical_align_bottom)),
),
Container(
color: Colors.black,
margin: EdgeInsets.all(20),
child: ImageWidget(
"assets/a.svg",
)),
TextWidget(
'$_counter',
backgroundColor: Colors.blue,
style: Theme.of(context).textTheme.bodyText2,
),
FlatButton(
onPressed: () {
Navigator.push(context,
MaterialPageRoute(builder: (context) {
return ThreeStoogesPage();
}));
},
child: Text("data")),
],
),
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: Icon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
}