如何在flutter中为Android和IOS创建双列表框

Question

Dual Listbox

我想在使用FLUTTER开发的屏幕之一中添加一个双列表框。我怎样才能做到这一点。有没有我可以尝试的插件。谢谢！！

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

class PurchaseScreen1 extends StatefulWidget {
  PurchaseScreen1({Key key}) : super(key: key);

  @override
  PurchaseScreen1State createState() => PurchaseScreen1State();
}

class PurchaseScreen1State extends State<PurchaseScreen1> {

  @override
  Widget build(BuildContext ctxt) {
    return new Scaffold(
      body: SingleChildScrollView(
              child: Column(
          children: <Widget>[
            SizedBox(
              width: 40,
              height: 40,
            ),
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: Container(
                width: 400,    
                height: 800,
                decoration: myBoxDecoration(), 
                child: Column(
          children: <Widget>[
            Container(
                width: 400,    
                height: 60,
                color: Colors.teal,
                child: Center(
                  child: Text('Purchase',style: TextStyle(
                    color : Colors.white,
                    fontSize: 26,
                    fontWeight : FontWeight.bold,
                  ),),
                ),
            ),
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: Row(
              children: <Widget>[
                Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: Container(
                    width: 170,    
                    height: 360,
                    decoration: myBoxDecoration(),
                    child: Column(
              children: <Widget>[
               Container(
                    width: 170,    
                    height: 60,
                    decoration: myBoxDecoration(),
                    child: ListTile(
                      title: Text('A-Z'),
trailing: const Icon(Icons.arrow_drop_down),
                    ),
               ),   

new ListView(
  shrinkWrap: true,
  padding: const EdgeInsets.all(20.0),
  children: <Widget>[
    const Text('Abilify'),
    const Text('Acetaminophen'),
    const Text('Acyclovir'),
    const Text('Adderall'),
    const Text('Adderall XR.'),
    const Text('Advair.'),
    const Text('Advair Diskus.'),
  ],
)

              ]
                    )

                  ),
                ),


                Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: Container(
                    width: 170,    
                    height: 360,
                    decoration: myBoxDecoration(),
                    child: Column(
              children: <Widget>[
 Container(
                width: 170,    
                height: 60,
                color: Colors.teal,
                child: Center(
                  child: Text('CHECKLIST',style: TextStyle(
                    color : Colors.white,
                    fontSize: 18,
                    fontWeight : FontWeight.bold,
                  ),),
                ),
            ),


              ]

                    ), 




                  ),
                )

              ]
              ),
            ),

 Padding(
                padding: const EdgeInsets.all(2.0),
                child: Center(
                  child: RaisedButton(
                    shape: new RoundedRectangleBorder(
                        borderRadius: new BorderRadius.circular(4.0),
                        side: BorderSide(color: Colors.teal)),
                    onPressed: () {
                    Navigator.of(context).pushNamedAndRemoveUntil(
                        '/purchase2', (Route<dynamic> route) => false);

                    },
                    color: Colors.teal,
                    textColor: Colors.white,
                    child: Text("Next".toUpperCase(),
                        style: TextStyle(fontSize: 14)),
                  ),
                ),
              ),                        


          ]
                ),
              ),
            ), 
          ]
        ),
      ),
    );
  }


  BoxDecoration myBoxDecoration() {
    return BoxDecoration(
      border: Border.all(width: 2.0),
      borderRadius: BorderRadius.all(
          Radius.circular(0.0) //         <--- border radius here
          ),
    );
  }



}
因此，购买的药品清单中，我们在双重清单框中从中添加了新的物品清单。选择药物并将其添加到新的项目列表中。

双重列表框我想在使用FLUTTER开发的屏幕之一中添加双重列表框。我怎样才能做到这一点。有没有我可以尝试的插件。谢谢！！！导入'package：flutter / material.dart'; ...

Answer 1

Developing for Multiple Screen Sizes and Orientations in Flutter (Fragments in Flutter)