0

当我单击应该显示我的底部工作表的按钮时，应用程序 UI 冻结，并且控制台显示底部工作表已打开 =>OPEN BOTTOMSHEET: 819031530没有任何错误。

我的底页小部件非常复杂。

我正在使用get包

Get.bottomSheet(
   SearchBottomSheetWidget(),
  )

小SearchBottomSheetWidget部件

class SearchBottomSheetWidget extends GetView<SearchDataService> {
  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        borderRadius: BorderRadius.only(
          topLeft: Radius.circular(22.0),
          topRight: Radius.circular(22.0),
        ),
      ),
      height: 500,
      child: Obx(
        () => controller.isSpecial.value == true
            ? Stack(
                children: [
                  GeneralOffers(),
                  SpecialOffers(),
                ],
              )
            : Stack(
                children: [
                  SpecialOffers(),
                  GeneralOffers(),
                ],
              ),
      ),
    );
  }
}

GeneralOffers和小SpecialOffers部件

class GeneralOffers extends GetView<SearchDataService> {
  @override
  Widget build(BuildContext context) {
    return SearchSide(
      backColor: AppUi.colors.appWhite,
      forgroundColor: AppUi.colors.appRed,
      boolState: false,
      mainAxisAlignment: controller.isSpecial.value == false
          ? MainAxisAlignment.start
          : MainAxisAlignment.end,
      headerButtons: Container(
        child: Row(
          children: [
            Expanded(
              child: Container(),
            ),
            Expanded(
              child: AppButton(
                color: AppUi.colors.appWhite,
                text: S.current.generalOffers,
                fontSize: controller.isSpecial.value == false ? 60.sp : 50.sp,
                titleColor: AppUi.colors.appRed,
                borderRadius: BorderRadius.only(
                  topRight: Radius.circular(50.0),
                  topLeft: Radius.circular(50.0),
                ),
                border: Border.all(
                  color: AppUi.colors.appWhite,
                ),
                onTap: () => controller.isSpecial.value = false,
              ),
            ),
          ],
        ),
      ),
    );
  }
}

class SpecialOffers extends GetView<SearchDataService> {
  @override
  Widget build(BuildContext context) {
    return SearchSide(
      backColor: AppUi.colors.appRed,
      forgroundColor: AppUi.colors.appWhite,
      buttonText: S.current.speciallOffers,
      boolState: true,
      mainAxisAlignment: controller.isSpecial.value
          ? MainAxisAlignment.start
          : MainAxisAlignment.end,
      headerButtons: Row(
        children: [
          Expanded(
            child: AppButton(
              color: AppUi.colors.appRed,
              text: S.current.speciallOffers,
              fontSize: controller.isSpecial.value == true ? 60.sp : 50.sp,
              titleColor: AppUi.colors.appWhite,
              borderRadius: BorderRadius.only(
                topRight: Radius.circular(50.0),
                topLeft: Radius.circular(50.0),
              ),
              border: Border.all(
                color: AppUi.colors.appRed,
              ),
              onTap: () => controller.isSpecial.value = true,
            ),
          ),
          Expanded(
            child: Container(),
          ),
        ],
      ),
    );
  }
}

最后，我认为问题出在它的小部件SearchSide

class SearchSide extends GetView<SearchDataService> {
  final Color backColor;
  final Color forgroundColor;
  final MainAxisAlignment mainAxisAlignment;
  final String buttonText;
  final bool boolState;
  final Widget headerButtons;

  SearchSide({
    this.backColor,
    this.forgroundColor,
    this.mainAxisAlignment,
    this.buttonText,
    this.boolState,
    this.headerButtons,
  });
  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: mainAxisAlignment,
      children: [
        headerButtons,
        Container(
          width: Get.width,
          height: controller.isSpecial.value == boolState
              ? Get.height * .5
              : Get.height * .485,
          padding: EdgeInsets.symmetric(horizontal: 12.0),
          decoration: BoxDecoration(
            color: backColor,
          ),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            children: [
              SearchDropDown(
                onChange: (val) => controller.assignCategoryValue(val),
                value: controller.categories[0],
                items: controller.categories,
                itemColor: forgroundColor,
              ),
              Row(
                children: [
                  Expanded(
                    child: Padding(
                      padding: const EdgeInsets.only(right: 12.0),
                      child: SearchDropDown(
                        onChange: (val) => controller.assignBrandValue(val),
                        value: controller.brands[0],
                        items: controller.brands,
                        itemColor: forgroundColor,
                      ),
                    ),
                  ),
                  Expanded(
                    child: Padding(
                      padding: const EdgeInsets.only(left: 12.0),
                      child: SearchDropDown(
                        onChange: (val) => controller.assignModelValue(val),
                        value: controller.models[0],
                        items: controller.models,
                        itemColor: forgroundColor,
                      ),
                    ),
                  ),
                ],
              ),
              Row(
                children: [
                  Expanded(
                    child: Padding(
                      padding: const EdgeInsets.only(right: 12.0),
                      child: SearchDropDown(
                        items: controller.years,
                        value: controller.years[0],
                        onChange: (val) => controller.assignFromYearValue(val),
                        itemColor: forgroundColor,
                      ),
                    ),
                  ),
                  Expanded(
                    child: Padding(
                      padding: const EdgeInsets.only(left: 12.0),
                      child: SearchDropDown(
                        items: controller.years,
                        value: controller.years[0],
                        onChange: (val) => controller.assignToYearValue(val),
                        itemColor: forgroundColor,
                      ),
                    ),
                  ),
                ],
              ),
              Row(
                children: [
                  Expanded(
                    child: Padding(
                      padding: const EdgeInsets.only(right: 12.0),
                      child: SearchDropDown(
                        items: controller.prices,
                        value: controller.prices[0],
                        itemColor: forgroundColor,
                        onChange: (val) => controller.assignFromPriceValue(val),
                      ),
                    ),
                  ),
                  Expanded(
                    child: Padding(
                      padding: const EdgeInsets.only(left: 12.0),
                      child: SearchDropDown(
                        value: controller.prices[0],
                        items: controller.prices,
                        itemColor: forgroundColor,
                        onChange: (val) => controller.assignToPriceValue(val),
                      ),
                    ),
                  ),
                ],
              ),
              NewOrUsed(forgroundColor),
              SearchAndClear(
                backColor,
                forgroundColor,
              ),
            ],
          ),
        ),
      ],
    );
  }
}

感谢任何能提供帮助的人

4

1 回答 1

0

我发现了问题。UI 冻结的原因不是小部件树中的错误，而是因为性能不佳的方法需要很长时间。

于 2021-08-14T04:58:03.620 回答