如何在单个列表中添加垂直列表和水平列表

Question

我想在单个列表中添加垂直和水平列表，但问题是当我要将水平和垂直列表放置在单个列表中时，我已经给容器指定了高度，但是对于垂直列表，我想在全屏中滚动，但不是可能我必须将高度设置为垂直列表，也请帮助我。

class mydynamic extends StatefulWidget {
@override
_mydynamicState createState() => _mydynamicState();
}

class _mydynamicState extends State<mydynamic> {

 List<String> my_text = [
"Hello",
"World",
"dasdasd",
"asdasdasd",
"sadasdasda"
 ];

 @override
 void dispose() {
 super.dispose();
 }

 @override
 Widget build(BuildContext context) {
 return Scaffold(
  appBar: AppBar(
    title: Text(
      "Videolist",
      style: TextStyle(color: Colors.white),
    ),
  ),
  body:ListView(

      children: <Widget>[

        _horizantal_list(),
        _vertical_list()
      ],

  ),
);
}



Widget _horizantal_list()
 {

  return Container(

    height:50.0,
    child: ListView.builder(
      
      itemCount: my_text.length,
      scrollDirection: Axis.horizontal,
      itemBuilder:(context,index){
        
          return Card(

            child: Text(my_text[index]),
          );
          

      }),
  );

}

 Widget _vertical_list()
  {

  return Container(
      height: 150,
    child:  ListView.builder(

        itemCount: my_text.length,
        itemBuilder: (context, index){

            return Card(
                
                child:Text(my_text[index]),
            );

        },

    ),
  );
      

}
}

请为此提供任何解决方案

Answer 1

您可以在下面复制粘贴运行完整代码
步骤1：import tkinter as tk from tkinter import ttk # Main App win = tk.Tk() win.title('Layout Test') win.geometry('1200x720+300+300') win.resizable(True, True) # Frame Design top_frame = tk.Frame(win, background="#FFF0C1", bd=1, relief="sunken") left_frame = tk.Frame(win, background="#D2E2FB", bd=1, relief="sunken") center_frame = tk.Frame(win, background="#CCE4CA", bd=1, relief="sunken") right_frame = tk.Frame(win, background ='lightblue', bd=1, relief='sunken') bottom_frame = tk.Frame(win, background="#F5C2C1", bd=1, relief="sunken") top_frame.grid(row=0, column=0, columnspan=3, sticky="nsew", padx=2, pady=2) left_frame.grid(row=1, column=0, sticky="nsew", padx=2, pady=2) center_frame.grid(row=1, column=1, sticky="nsew", padx=2, pady=2) right_frame.grid(row=1, column=2, sticky="nsew", padx=2, pady=2) bottom_frame.grid(row=3, column=0, columnspan=3, sticky="nsew", padx=2, pady=2) win.grid_rowconfigure(0, weight=6) win.grid_rowconfigure(1, weight=40) win.grid_rowconfigure(3, weight=1) win.grid_columnconfigure(0, weight=1) win.grid_columnconfigure(1, weight=2) win.grid_columnconfigure(2, weight=4) treeview = ttk.Treeview(center_frame) # <-- changed master from win to center_frame treeview.pack(side=tk.LEFT, fill=tk.BOTH, expand=1) # <-- pack works now # Program here # Status Bar at bottom_frame works well with pack statustext = tk.StringVar() statustext.set(' ... choose your avm_xml file') # will be changed from file dialoge status = ttk.Label(bottom_frame, textvariable=statustext, borderwidth='25', relief=tk.SUNKEN, anchor=tk.W) status.pack(side=tk.BOTTOM, fill=tk.X) #fill='both', expand=False, padx=8, pady=8 win.mainloop() 使用body
步骤2：_vertical_list使用Column

Expanded

工作演示

完整代码

 Widget _vertical_list() {
    return Expanded(
      child: ListView.builder(

Answer 2

我在这里更新了代码

 class mydynamic extends StatefulWidget {
 @override
 _mydynamicState createState() => _mydynamicState();
}

class _mydynamicState extends State<mydynamic> {

List<String> my_text = [
"Hello",
"World",
"dasdasd",
"asdasdasd",
"sadasdasda",

  "Hello",
"World",
"dasdasd",
"asdasdasd",
"sadasdasda",
  "Hello",
"World",
"dasdasd",
"asdasdasd",
"sadasdasda",
  "Hello",
"World",
"dasdasd",
"asdasdasd",
"sadasdasda",
  "Hello",
"World",
"dasdasd",
"asdasdasd",
"sadasdasda",

];

@override
void dispose() {
super.dispose();
}

@override
Widget build(BuildContext context) {
return Scaffold(
  appBar: AppBar(
    title: Text(
      "Videolist",
      style: TextStyle(color: Colors.white),
    ),
  ),
  body: CustomScrollView(

     slivers: <Widget>[

       SliverList(delegate:SliverChildListDelegate([

          Column(

            children: <Widget>[

               _vertical_list(),
               _horizontal_list(),
                _vertical_list(),
             
            ],
          )

       ]))

     ],

  ),
 
);
 }



Widget _vertical_list()
{
  return Column(

  children: <Widget>[

    ListView.builder(
      scrollDirection: Axis.vertical,
      physics: ClampingScrollPhysics(),
      shrinkWrap: true,
      itemCount: my_text.length,
      itemBuilder: (context,index){

          return Card(child:Text(my_text[index]));


    })
  ],

 );
}

Widget _horizontal_list()
{


  return Container(
  height:50.0,
  child: ListView.builder(
   shrinkWrap: true,
    scrollDirection: Axis.horizontal,
   itemCount: my_text.length,
   itemBuilder:(context,index){
    
    return Card(

      child: Center(child: Container(child: Text(my_text[index]))),
    );

 }),
);
}

}