What I want to do is to add an independent item in fron at listview.builder in flutter Like Instagram Stories the first element should be independent from the others items into the listview.builder. This is my code for listview.builder

 ListView.builder(
            scrollDirection: Axis.horizontal,
            shrinkWrap: true,
            itemBuilder: (ctx, int) {
              return Card(
                elevation: 5,
                shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(5)),
                child: Container(
                  decoration: BoxDecoration(
                    color: Color(0xFF1f2032),
                    borderRadius: BorderRadius.circular(5),
                  ),
                  width: 130,
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                    Icon(Icons.book,color: Colors.white,size: 16,),
                    SizedBox(width: 5,),
                    Text(
                      aliasName,
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 14,
                        fontWeight: FontWeight.w300,
                      ),
                    )
                  ]),
                ),
              );
            },
          ),


Solution 1: zfnadia

Please check the following code to add an independent item on top of the list.

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  List<String> items = ['one', 'two', 'three', 'four', 'five'];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Test List Builder'),
      ),
      body: ListView.builder(
        itemCount: items.length + 1,
        itemBuilder: (context, int index) {
          return index == 0
              ? headerItem()
              : ListTile(title: Text(items[index - 1]));
        },
      ),
    );
  }

  Widget headerItem() {
    return ListTile(
        title: Text('Independent list item',
      style: TextStyle(color: Colors.blue),
    ));
  }
}

enter image description here