如何从右到左滚动 singlechildscrollview 水平轴答案

【问题标题】：how to scroll singlechildscrollview horizontal axis from right to left如何从右到左滚动 singlechildscrollview 水平轴
【发布时间】：2021-08-12 04:12:11
【问题描述】：

我有需要水平滚动的内容，我从 scrollDirection: Axis.horizontal 但我的问题是我想从右侧开始滚动我的意思是具有水平轴的 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,
                                     
                                   )
                      ),
                    ),
                  );
      },

【问题讨论】：

请考虑将您的代码放在这里，以使问题更清晰并提供帮助。

标签： flutter flutter-layout

【解决方案1】：

只需设置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()),
                      ),
                    ),
                  );
      },

【讨论】：

它工作完美，谢谢@siddharth Agrawal

【解决方案2】：

在您的文本小部件中使用textDirection: TextDirection.rtl

【讨论】：

【解决方案3】：

试试这个

SingleChildScrollView(
 scrollDirection: Axis.horizontal,
 // add this line
 dragStartBehavior: DragStartBehavior.down,
 ...
)

【讨论】：