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

इसके अलावा, यह निचला बार कुछ हद तक पारदर्शी हो जाता है, इसलिए आप मुश्किल से देख सकते हैं कि इसके नीचे क्या है। क्या स्पंदन में ऐसा करना संभव है? मुझे पता है कि यह मुख्य ऐप बार पर संभव नहीं है, क्योंकि इसके बारे में बात करने में कोई समस्या है यहां< /ए>

संदर्भ के लिए छवि

0
user2876983 7 जुलाई 2019, 20:53

2 जवाब

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

अचयनित बॉटमनेविगेशनबारआइटम का शीर्षक छुपाएं

आपको बस नीचे नेविगेशन बार की शो अचयनित लेबल संपत्ति को गलत पर सेट करने की आवश्यकता है

showUnselectedLabels: false,

पारदर्शी बॉटमनेविगेशन बार

Scaffold ऐपबार और बॉटमनेविगेशन बार दोनों के लिए प्लेसहोल्डर प्रदान करता है। इस तरह उन्हें लगाया जाता है।

यहां समस्या यह है कि शरीर ऐपबार या बॉटमनेविगेशन बार को ओवरलैप नहीं करता है, और इस प्रकार यदि आप पारदर्शी पृष्ठभूमि देते हैं तो भी यह कुछ भी नहीं करता है।

बॉडी, ऐपबार और बॉटमनेविगेशनबार को एक स्टैक के अंदर रखना और ऐपबार और बॉटमनेविगेशनबार को उचित स्थिति में रखना एक समाधान होगा।

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: <Widget>[
          Container(
            color: Colors.green, // Content of body here
          ),
          Positioned(
            left: 0,
            right: 0,
            top: 0,
            child: AppBar(
              elevation: 0,
              backgroundColor: Colors.indigo.withAlpha(80),
              title: Text('Some Text'),
            ),
          ),
          Positioned(
            left: 0,
            right: 0,
            bottom: 0,
            child: BottomNavigationBar(
              elevation: 0,
              showUnselectedLabels: false,
              backgroundColor: Colors.red.withAlpha(80),
              items: [
                BottomNavigationBarItem(
                  title: Text('A'),
                  icon: Icon(Icons.add),
                ),
                BottomNavigationBarItem(
                  title: Text('B'),
                  icon: Icon(Icons.remove),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}
1
Ajil O. 8 जुलाई 2019, 08:09

यू को इस कोड का उपयोग करना चाहिए:

bottomNavigationBar: BottomNavigationBar(
 //use both properties
  type: BottomNavigationBarType.fixed,
  showUnselectedLabels: true,
//-----------
  items: const <BottomNavigationBarItem>[
  BottomNavigationBarItem(
    icon: Icon(Icons.icon1),
    label:'item 1',
  ),
  BottomNavigationBarItem(
    icon: Icon(Icons.icon2),
    label: 'item 2',
  ),
 ],
)
0
Maryam Azhdari 2 जिंदा 2021, 00:50