CODEWITHSUNDEEP
flutterdart
mohammad
mohammad

Reputation: 2900

Is it possible to have any widget like this in flutter

Is there any built in widget in flutter to implement a widget like(red border in picture below) ?

which we can drag it change the value.

finger slider

Upvotes: 2

Views: 84

Answers (2)

Maadhav Sharma
Maadhav Sharma

Reputation: 587

The desired output can be brought using the ListView. Flutter just uploaded a video on ListView in which you can find your answer: https://www.youtube.com/watch?v=KJpkjHGiI5A

Example code:

    import 'package:flutter/material.dart';

void main() => runApp(MyApp());
bool change ;
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  int i=0;
void fxn(){
  setState(() {
    i++;
  });
}
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('List View'),),
    body:  ListView.builder(
      itemCount: 30,
      itemBuilder: (_, index)=>Padding(
        padding: const EdgeInsets.fromLTRB(0, 270, 0, 270),
        child: MaterialButton(
          child: 

            Text('200$index',style: TextStyle(fontSize: 25),),
            onPressed: (){
            },
            color: Colors.white70,
        ),
      ),

      scrollDirection: Axis.horizontal,


    )
    );
  }
}

Output: Output

Upvotes: 1

CopsOnRoad
CopsOnRoad

Reputation: 267584

That's simply a horizontal ListView with predefined height. 

SizedBox(
  height: 56, // height of ListView
  child: ListView.builder(
    scrollDirection: Axis.horizontal, // makes it scroll in horizontal direction
    itemBuilder: (_, index) {
      // build your years 
    },
  ),
)

Upvotes: 1

Related Questions