Question

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

class Screen extends StatefulWidget {
  @override
  _UserProfileScreenState createState() => _UserProfileScreenState();
}

class _UserProfileScreenState extends State<Screen> {
  Widget randomjobs() {
    final dbRef = FirebaseDatabase.instance
        .reference()
        .child("Add Job Details")
        .limitToFirst(3);

    return FutureBuilder(
      future: dbRef.once(),
      builder: (context, AsyncSnapshot<DataSnapshot> snapshot) {
        if (snapshot.hasData) {
          List<Map<dynamic, dynamic>> list = [];
          if (snapshot.data.value == null) {
            return Text("no Data");
          }
          for (String key in snapshot.data.value.keys) {
            list.add(snapshot.data.value[key]);
          }
          return ListView.builder(
              itemCount: snapshot.data.value.length,
              itemBuilder: (BuildContext context, int index) {
                return Container(
                    margin: EdgeInsets.only(top: 20.0),
                    height: 220.0,
                    child: PageView(
                      scrollDirection: Axis.horizontal,
                      children: <Widget>[
                        Container(
                          margin: EdgeInsets.only(left: 8, right: 8),
                          padding: EdgeInsets.only(
                              top: 20.0, left: 20.0, right: 20.0),
                          width: 240.0,
                          height: 240.0,
                          decoration: BoxDecoration(
                            borderRadius:
                                BorderRadius.all(Radius.circular(20.0)),
                            gradient: LinearGradient(
                              begin: Alignment.bottomRight,
                              end: Alignment.topLeft,
                              stops: [0.2, 0.6],
                              colors: [
                                Color(0xff7500bf),
                                Color(0xff5b1ad1),
                              ],
                            ),
                          ),
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: <Widget>[
                              Container(
                                child: Text(list[index]["Job Title"],
                                    style: TextStyle(
                                        fontSize: 20.0,
                                        fontWeight: FontWeight.w500,
                                        color: Color(0xfffefeff))),
                              ),
                              Container(
                                margin: EdgeInsets.only(top: 10.0),
                                child: Opacity(
                                  opacity: 0.6,
                                  child: Text(list[index]["Job Title"],
                                      style: TextStyle(
                                          fontSize: 14.0,
                                          fontWeight: FontWeight.w600,
                                          color: Color(0xffffffff))),
                                ),
                              ),
                              Container(
                                margin: EdgeInsets.only(top: 10.0),
                                child: Opacity(
                                  opacity: 0.49,
                                  child: Text(list[index]["Job Title"],
                                      style: TextStyle(
                                          fontSize: 12.0,
                                          fontWeight: FontWeight.w600,
                                          color: Color(0xffffffff))),
                                ),
                              ),
                              Container(
                                margin: EdgeInsets.only(top: 60.0),
                                child: Row(
                                  mainAxisAlignment: MainAxisAlignment.end,
                                  children: <Widget>[
                                    GestureDetector(
                                      onTap: () {},
                                      child: Container(
                                        padding: EdgeInsets.only(
                                            top: 12.0,
                                            left: 15.0,
                                            right: 15.0,
                                            bottom: 12.0),
                                        decoration: BoxDecoration(
                                            color: new Color.fromRGBO(
                                                255, 255, 255, 0.5),
                                            borderRadius: BorderRadius.all(
                                                Radius.circular(12.0))),
                                        child: Opacity(
                                          opacity: 0.7,
                                          child: Text('APPLY',
                                              style: TextStyle(
                                                  fontSize: 12.0,
                                                  fontWeight: FontWeight.w600,
                                                  color: Color(0xfffefeff))),
                                        ),
                                      ),
                                    )
                                  ],
                                ),
                              )
                            ],
                          ),
                        )
                      ],
                    ));
              });
        }
        return CircularProgressIndicator();
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Job')),
      body: randomjobs(),
    );
  }
}

这是页面的总代码。它在垂直方向上打印，而我在水平方向上需要。即使我使用水平滚动方向，也无法实现。 scrollDirection：Axis.horizontal我已经在代码中使用了此方法，但结果仍然是我无法在应用栏下方获得水平滚动。

谢谢

Answer 1

这是您的尝试吗？

body: ListView.builder(
        shrinkWrap: true,
        //add item count depending on your list
        //itemCount: list.length,
        itemCount: 4,

        //added scrolldirection
        scrollDirection: Axis.horizontal,

        itemBuilder: (BuildContext context, int index) {

          //Removed your pageview
          return Container(
            height: 240.0,
            margin: EdgeInsets.only(left: 8, right: 8, top: 20),
            padding: EdgeInsets.only(top: 20.0, left: 20.0, right: 20.0),

            // rest of your code

为什么水平滚动方向不起作用？

1 个答案: