Skip to content

Instantly share code, notes, and snippets.

@supernovel
Created October 2, 2019 15:16
Show Gist options
  • Save supernovel/954c15af702b04a315d83fd28a43599d to your computer and use it in GitHub Desktop.
Save supernovel/954c15af702b04a315d83fd28a43599d to your computer and use it in GitHub Desktop.
flutter line text
import 'package:flutter/material.dart';
import 'package:flutter/semantics.dart';
class LineText extends CustomPainter {
final String text;
final TextStyle style;
final double padding;
final Color strokeColor;
final double strokeWidth;
final Alignment alignment;
LineText(
{this.text,
this.style,
this.padding = 12.0,
this.strokeColor = Colors.black,
this.strokeWidth = 1.0,
this.alignment});
@override
void paint(Canvas canvas, Size size) {
final TextPainter tp = TextPainter(
text: TextSpan(
text: this.text,
style: this
.style
.merge(TextStyle(textBaseline: TextBaseline.ideographic))),
textDirection: TextDirection.ltr,
textAlign: TextAlign.start)
..layout();
final Offset offset = alignment.alongSize(size);
final double start = (size.width - tp.width) / 2.0 - padding;
final double extent = tp.width + (padding * 2);
final Path path = Path()
..moveTo(0.0, offset.dy)
..lineTo(start, offset.dy)
..relativeMoveTo(extent, 0.0)
..lineTo(size.width, offset.dy);
canvas.drawPath(
path,
Paint()
..color = this.strokeColor
..strokeWidth = this.strokeWidth
..style = PaintingStyle.stroke);
tp.paint(canvas, Offset((size.width - tp.width) / 2.0, -(tp.height) / 2 + offset.dy));
}
@override
SemanticsBuilderCallback get semanticsBuilder {
return (Size size) {
var rect = Offset.zero & size;
var width = size.shortestSide * 0.4;
rect = const Alignment(0.8, -0.9).inscribe(Size(width, width), rect);
return [
CustomPainterSemantics(
rect: rect,
properties: SemanticsProperties(
label: this.text,
textDirection: TextDirection.ltr,
),
),
];
};
}
@override
bool shouldRepaint(LineText oldDelegate) => false;
@override
bool shouldRebuildSemantics(LineText oldDelegate) => false;
}
@supernovel
Copy link
Author

supernovel commented Oct 2, 2019

CustomPaint(
    painter: LineText(
        alignment: Alignment.center,
        text: 'label',
        style: TextStyle(color: Colors.white),
        strokeColor: Colors.white54))

----- label -----

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment