这是我目前的代码,已经在Flutter的API文档中搜索了一段时间,并没有找到适合实现的东西。
new Row(
children: <Widget>[
new Expanded(
child: const Text("Some text"),
),
const Text("Some other text"),
],
)
任何指针或想法如何做到这一点?
答案 0 :(得分:4)
好。通过使用自定义Decoration
来实现它
这是我的代码:
class StrikeThroughDecoration extends Decoration {
@override
BoxPainter createBoxPainter([VoidCallback onChanged]) {
return new _StrikeThroughPainter();
}
}
class _StrikeThroughPainter extends BoxPainter {
@override
void paint(Canvas canvas, Offset offset, ImageConfiguration configuration) {
final paint = new Paint()
..strokeWidth = 1.0
..color = Colors.black
..style = PaintingStyle.fill;
final rect = offset & configuration.size;
canvas.drawLine(new Offset(rect.left, rect.top + rect.height / 2), new Offset(rect.right, rect.top + rect.height / 2), paint);
canvas.restore();
}
}
在我的组件中使用:
new Container(
foregroundDecoration: new StrikeThroughDecoration(),
child: new Row(
children: <Widget>[
new Expanded(
child: const Text("Some text"),
),
const Text("Some other text"),
],
)
)
答案 1 :(得分:2)
您可以将Stack
与Divider
一起使用。
import 'dart:async';
import 'package:flutter/material.dart';
void main() {
runApp(new MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
home: new HomePage(),
);
}
}
class HomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(title: new Text('Example App')),
body: new Padding(
padding: new EdgeInsets.all(5.0),
child: new Center(
child: new Stack(
children: <Widget>[
new Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
new Text('Hello world'),
new Text('Some other text'),
],
),
new Positioned.fill(
left: 0.0,
right: 0.0,
child: new Divider(color: Colors.black),
)
],
),
),
),
);
}
}