मैं Stack में ListView.builder का उपयोग कर रहा हूं। लेकिन गोलाकार कंटेनर एक दूसरे को ओवरलैप नहीं कर रहे हैं। मैं उन्हें कैसे ओवरलैप कर सकता हूं? मैंने आउटपुट का कोड और स्क्रीनशॉट भी संलग्न किया है।

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class Emniii extends StatelessWidget {
  const Emniii({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        height: 30,
        width: MediaQuery.of(context).size.width,
        margin: EdgeInsets.only(top: 10),
        child: Center(
          child: Stack(
            children: [
              ListView.builder(
                  itemCount: 13,
                  shrinkWrap: true,
                  scrollDirection: Axis.horizontal,
                  itemBuilder: (_, index) {
                    return Container(
                      height: 30,
                      width: 30,
                      decoration: BoxDecoration(
                        color: Colors.black,
                        borderRadius: BorderRadius.circular(15),
                      ),
                    );
                  }),
            ],
          ),
        ),
      ),
    );
  }
}

वर्तमान आउटपुट

enter image description here

मैं क्या उम्मीद कर रहा हूं

enter image description here

0
FEIGNED GANGER 25 पद 2021, 13:30

1 उत्तर

सबसे बढ़िया उत्तर

ListView सबसे अधिक इस्तेमाल किया जाने वाला स्क्रॉलिंग विजेट है। यह अपने बच्चों को एक के बाद एक स्क्रॉल दिशा में प्रदर्शित करता है। क्रॉस अक्ष में, बच्चों को ListView भरने की आवश्यकता होती है।

आपके मामले में आप केवल 13 Containers उत्पन्न करना चाहते हैं, लूप या List.generate का उपयोग करें और उन्हें संरेखित करने के लिए Positioned विजेट का उपयोग करें।

मैं left: index * 15, का उपयोग कर रहा हूं, यह कंटेनर की आधी चौड़ाई से दाएं स्थानांतरित हो रहा है।

child: Stack(
  children: [
    ...List.generate(
      13,
      (index) => Positioned(
        left: index * 15,
        child: Container(
          height: 30,
          width: 30,
          decoration: BoxDecoration(
            color: index.isEven ? Colors.black : Colors.grey,
            borderRadius: BorderRadius.circular(15),
          ),
        ),
      ),
    ),
  ],
),

ListView और Stack

1
Yeasin Sheikh 25 पद 2021, 13:55
मेरे पास एक फोटो अपडेट है जिसकी मैं वास्तव में उम्मीद कर रहा हूं। क्या आप कृपया इसकी जांच कर सकते हैं?
 – 
FEIGNED GANGER
25 पद 2021, 13:49
अपडेट किया गया, आप स्थित विजेट के बारे में अधिक जानकारी प्राप्त कर सकते हैं
 – 
Yeasin Sheikh
25 पद 2021, 13:58