In one line,How to build a auto-scrolling text to show all string, Instead of use clip or ellipsis?

303 views
Skip to first unread message

huang

unread,
Jun 4, 2018, 2:32:13 AM6/4/18
to Flutter Dev

what I need is a widget like the gif above.
I have tried to do,but have no way to start.
can you give me some suggestion?
thank you very much!

Aolose

unread,
Jun 4, 2018, 6:47:39 AM6/4/18
to Flutter Dev
import 'package:flutter/animation.dart';
import 'package:flutter/material.dart';

class AutoScrollText extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return new _AutoScrollTextState();
}
}

class _AutoScrollTextState extends State<AutoScrollText>
with SingleTickerProviderStateMixin {
ScrollController scrollCtrl = new ScrollController();
AnimationController animateCtrl;

@override
void dispose() {
animateCtrl.dispose();
super.dispose();
}

@override
initState() {
double offset = 0.0;
super.initState();
animateCtrl =
new AnimationController(vsync: this, duration: Duration(seconds: 3))
..addListener(() {
if (animateCtrl.isCompleted) animateCtrl.repeat();
offset += 1.0;
if (offset - 1 > scrollCtrl.offset) {
offset = 0.0;
}
setState(() {
scrollCtrl.jumpTo(offset);
});
});
animateCtrl.forward();
}

@override
Widget build(BuildContext context) {
return Scaffold(
body: new Center(
child: Container(
width: 200.0,
height: 30.0,
child: DecoratedBox(
decoration: BoxDecoration(
color: const Color.fromRGBO(0, 0, 0, .5),
borderRadius:
const BorderRadius.all(const Radius.circular(15.0))),
child: ListView(
controller: scrollCtrl,
children: <Widget>[
Text(" testA testB testC testD ",
style: new TextStyle(color: Colors.white, fontSize: 24.0)),
Text(" testA testB testC testD ",
style: new TextStyle(color: Colors.white, fontSize: 24.0)),
],
scrollDirection: Axis.horizontal,
),
),
),
));
}
}

在 2018年6月4日星期一 UTC+8下午2:32:13,huang写道:

huang

unread,
Jun 4, 2018, 10:10:52 PM6/4/18
to Flutter Dev
Thank you very much indeed!
 Wish you a happy life, work smoothly!

在 2018年6月4日星期一 UTC+8下午6:47:39,Aolose写道:
Reply all
Reply to author
Forward
0 new messages