时间戳

首页 > 解决方案 > 如何从右到左滚动 singlechildscrollview 水平轴

flutter - 如何从右到左滚动 singlechildscrollview 水平轴

问题描述

我有需要水平滚动的内容，我从scrollDirection使用：Axis.horizo​​ntal，但我的问题是我想从右侧滚动我的意思是水平轴的SingleChildScrollView从左到右滚动它，但我希望SingleChildScrollView从右到左滚动，我用 Align 包装 singleChildScrollView 并将对齐设置为右，但我不工作。这是我的代码：

SingleChildScrollView(
                    scrollDirection: Axis.vertical,
                    child: SingleChildScrollView(
                      scrollDirection: Axis.horizontal,
                      child: Padding(
                        padding: EdgeInsets.only(
                            top: 2 * SizeConfig.heightMultiplier),
                        child: DataTable(
                            showBottomBorder: false,
                            headingTextStyle: TextStyle(
                              fontWeight: FontWeight.bold,
                              fontSize: 2.5 * SizeConfig.heightMultiplier,
                              color: Colors.black,
                            ),
                            dataTextStyle: TextStyle(
                                fontSize: 2.5 * SizeConfig.heightMultiplier,
                                color: Colors.black),
                            columns: <DataColumn>[
                              DataColumn(
                                label: Text(
                                  'حساب',
                                  textDirection: TextDirection.rtl,
                                ),
                              ),
                              DataColumn(
                                label: Text(
                                  'تفصیل',
                                  textDirection: TextDirection.rtl,
                                ),
                              ),
                              DataColumn(
                                label: Text(
                                  'بردگی',
                                  textDirection: TextDirection.rtl,
                                ),
                              ),
                              DataColumn(
                                label: Text(
                                  'آوردگی',
                                  textDirection: TextDirection.rtl,
                                ),
                              ),
                              DataColumn(
                                label: Text(
                                  'تاریخ',
                                  textDirection: TextDirection.rtl,
                                ),
                              ),
                            ],
                            rows:<DataRow> [ DataRow(
                                    cells: <DataCell>[
                                      DataCell(
                                       Text('ملیجه ارش',textDirection: 
                                        TextDirection.rtl,
                                          )
                                      ),
                                      DataCell(
                                        Text('ملیجه ارش',
                                    textDirection: TextDirection.rtl,)
                                      ),
                                      DataCell(Text(
                                       Text('ملیجه ارش',
                                        textDirection: TextDirection.rtl,
                                      )),
                                      DataCell(Text(
                                      Text('ملیجه ارش',
                                        textDirection: TextDirection.rtl,
                                      )),

                                      DataCell(Text(
                                       Text('ملیجه ارش',
                                        textDirection: TextDirection.rtl,
                                     
                                   )
                      ),
                    ),
                  );
      },

标签： flutterflutter-layout

解决方案

简单设置reverse:true。
代码看起来像

SingleChildScrollView(
                    scrollDirection: Axis.vertical,
                    reverse:true,
                    child: SingleChildScrollView(
                      scrollDirection: Axis.horizontal,
                      child: Padding(
                        padding: EdgeInsets.only(
                            top: 2 * SizeConfig.heightMultiplier),
                        child: DataTable(
                            showBottomBorder: false,
                            headingTextStyle: TextStyle(
                              fontWeight: FontWeight.bold,
                              fontSize: 2.5 * SizeConfig.heightMultiplier,
                              color: Colors.black,
                            ),
                            dataTextStyle: TextStyle(
                                fontSize: 2.5 * SizeConfig.heightMultiplier,
                                color: Colors.black),
                            columns: <DataColumn>[
                              DataColumn(
                                label: Text(
                                  'حساب',
                                  textDirection: TextDirection.rtl,
                                ),
                              ),
                              DataColumn(
                                label: Text(
                                  'تفصیل',
                                  textDirection: TextDirection.rtl,
                                ),
                              ),
                              DataColumn(
                                label: Text(
                                  'بردگی',
                                  textDirection: TextDirection.rtl,
                                ),
                              ),
                              DataColumn(
                                label: Text(
                                  'آوردگی',
                                  textDirection: TextDirection.rtl,
                                ),
                              ),
                              DataColumn(
                                label: Text(
                                  'تاریخ',
                                  textDirection: TextDirection.rtl,
                                ),
                              ),
                            ],
                            rows: state.roznamcha
                                .map(
                                  (data) => DataRow(
                                    cells: <DataCell>[
                                      DataCell(
                                        GetAccount(
                                          id: data.accountNum,
                                        ),
                                      ),
                                      DataCell(
                                        Text(
                                          data.description,
                                          textDirection: TextDirection.rtl,
                                        ),
                                      ),
                                      DataCell(Text(
                                        data.debit.toString(),
                                        textDirection: TextDirection.rtl,
                                      )),
                                      DataCell(Text(
                                        data.credit.toString(),
                                        textDirection: TextDirection.rtl,
                                      )),

                                      DataCell(Text(
                                        data.issueDate.toString(),
                                        textDirection: TextDirection.rtl,
                                      )),
                                      //     DataCell(
                                      //         //Text('ii')
                                      //         InkWell(
                                      //             onTap: () async {
                                      //               CustomAlertDialog
                                      //                   .showAlertDialog(
                                      //                       context: context,
                                      //                       deleteFunction:
                                      //                           () async {
                                      //                         await BlocProvider.of<
                                      //                                     RoznamchaCubit>(
                                      //                                 context)
                                      //                             .deleteRoznamcha(data
                                      //                                 .transactionNumber)
                                      //                             .whenComplete(() {
                                      //                           ScaffoldMessenger
                                      //                                   .of(context)
                                      //                               .showSnackBar(
                                      //                                   SnackBar(
                                      //                                       content:
                                      //                                           Text(
                                      //                             'حذف شد به اجازه ات',
                                      //                             textDirection:
                                      //                                 TextDirection
                                      //                                     .rtl,
                                      //                           )));
                                      //                           Navigator.pop(
                                      //                               context);
                                      //                         });
                                      //                       });
                                      //             },
                                      //             child: Text('حذف'))),
                                    ],
                                  ),
                                )
                                .toList()),
                      ),
                    ),
                  );
      },

推荐阅读