Roman Traversine
Roman Traversine

Reputation: 928

How to make a simple Timeline UI?

I am going to make a timeline interface that shows us the progress going. In this case for the marketplace.

Here what I want:

enter image description here

I was looking for the code but I can't find the way to make it.

I mean I'm not going to using stack with this case

Upvotes: 0

Views: 6180

Answers (2)

Now you can do this easily with timeline_tile.

Check out this specific delivery layout:

Also, the beautiful_timelines repository contains some examples built with this package.

Web demo

Upvotes: 0

Akshay Katariya
Akshay Katariya

Reputation: 1474

Check out this library

import 'package:timeline_list/timeline.dart';
import 'package:timeline_list/timeline_model.dart';

List<TimelineModel> items = [
      TimelineModel(Placeholder(),
          position: TimelineItemPosition.random,
          iconBackground: Colors.redAccent,
          icon: Icon(Icons.blur_circular)),
      TimelineModel(Placeholder(),
          position: TimelineItemPosition.random,
          iconBackground: Colors.redAccent,
          icon: Icon(Icons.blur_circular)),
    ];
    return Timeline(children: items, position: TimelinePosition.Center);

Upvotes: 1

Related Questions