【问题标题】:How to always align button to screen bottom in a bottom sheet dialog fragment如何始终在底部工作表对话框片段中将按钮与屏幕底部对齐
【发布时间】:2019-10-08 16:46:30
【问题描述】:

我有一个扩展 BottomSheetDialogFragment 的自定义类,该类将在单击按钮时显示。 我的自定义 BottomSheetDialogFragment 布局有 3 个部分。

a.A 标题文本,

b.一个单选组(我动态添加 n 个项目)

c.底部的OK按钮(我想一直显示在底部)

这是我点击按钮时的样子。

实际上在我的对话框片段第一次启动时,我的 OK 按钮是不可见的。但是当我展开 BottomSheet 时,它看起来像下面,并且我的 OK 按钮是可见的

但我需要的是始终显示我的底部 OK 按钮,即当我的对话框片段启动时,我的 OK 按钮应该出现在底部,而不管它有多少单选按钮以及何时展开,那么确定按钮也应该在底部,我的单选按钮应该是可滚动的

下面是我的对话框片段布局:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>

<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/nested_scroll_view"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
>

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    >

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_marginTop="25dp"
        android:layout_marginRight="20dp"
        android:layout_alignParentTop="true"
        android:text=""
        />


    <RadioGroup
        android:id="@+id/radiogroup"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="15dp"
        android:layout_marginLeft="15dp"
        android:layout_below="@id/title"
        android:layout_marginBottom="10dp"
        >
    </RadioGroup>


    <android.widget.Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/ok"
        android:layout_below="@id/radiogroup"
        android:text="OK"
        android:layout_marginTop="10dp"
        android:layout_alignParentBottom="true"
        ></android.widget.Button>

</RelativeLayout>
</androidx.core.widget.NestedScrollView>
</LinearLayout>

这是我的自定义 BottomSheetDialogFragment

public class BottomSheetExample extends BottomSheetDialogFragment {

@BindView(R.id.title)
TextView title;

@BindView(R.id.ok)
Button ok;

@BindView(R.id.nested_scroll_view)
NestedScrollView nestedScrollView;

@BindView(R.id.radiogroup)
RadioGroup radioGroup;

// TODO: Rename and change types of parameters

public BottomSheetExample() {
    // Required empty public constructor
}

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {

    View view = inflater.inflate(R.layout.bottom_sheet, container, false);

    ButterKnife.bind(this, view);

    ArrayList<String> list = new ArrayList<>();
    for(int i=0;i<15;i++){
        list.add(""+i);
    }

    title.setText("Numbers");

    RadioGroup rg = radioGroup;

    for (int i = 0; i < list.size(); i++) {
        RadioButton rbn = new RadioButton(getContext());
        rbn.setId(View.generateViewId());
        String radioButtonText = list.get(i);
        rbn.setText(radioButtonText);
        rg.addView(rbn);
    }

    return view;
}   
}

这就是我如何称呼我的底页:

BottomSheetExample bottomSheet = new BottomSheetExample();
bottomSheet.showNow(this.getSupportFragmentManager(), "tag");

任何输入都将非常有用。提前致谢!

【问题讨论】:

  • 我也遇到了同样的问题,你找到解决办法了吗?
  • @Himanshu 我已经添加了我的解决方案。
  • @Himanshu,如果对你有帮助,请点赞我的回答

标签: android android-fragments android-scrollview bottom-sheet android-nestedscrollview


【解决方案1】:

终于,我找到了解决办法。

1.为了正确使用bottomsheet,我使用coordinatorlayout,而top LinearLayout 有bottom sheet 行为

2.我已经让 radiogroup 适合嵌套滚动视图。我希望​​固定嵌套滚动视图的最大高度。但不幸的是,没有最大高度方法。因此,LinearLayout 容纳了我们拥有无线电组的嵌套滚动视图。 现在我已经将线性布局的高度设置为 300dp。布局部分完成

3.现在我们要修复bottomsheet部分。从1中提到的顶部LinearLayout获取BottomSheetBehaviour实例。所以现在将bottomsheet的peek高度设置为300dp。这样做是为了将底部工作表固定到适合问题中提到的用例的特定高度。

XML:

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout                 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
>

<LinearLayout
    android:id="@+id/bottom_sheet_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <TextView
            android:id="@+id/title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:textStyle="bold"
            android:textSize="20sp"
            />

        <LinearLayout
            android:layout_below="@id/title"
            android:id="@+id/scroll_layout"
            android:layout_width="match_parent"
            android:layout_height="300dp">

            <androidx.core.widget.NestedScrollView
                android:id="@+id/nested_scroll_view"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:fillViewport="true"
                app:layout_behavior="@string/appbar_scrolling_view_behavior">


                <RadioGroup
                    android:id="@+id/radiogroup"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_below="@id/title"
                    android:layout_marginBottom="10dp" />

            </androidx.core.widget.NestedScrollView>

        </LinearLayout>

        <androidx.appcompat.widget.AppCompatButton
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="OK"
            android:id="@+id/click_btn"
            android:layout_below="@id/scroll_layout"/>

    </RelativeLayout>

</LinearLayout>

JAVA:

public class BottomSheetExample extends BottomSheetDialogFragment {

@BindView(R.id.title)
TextView title;

@BindView(R.id.click_btn)
Button ok;

@BindView(R.id.nested_scroll_view)
NestedScrollView nestedScrollView;

@BindView(R.id.radiogroup)
RadioGroup radioGroup;

@BindView(R.id.bottom_sheet_layout)
LinearLayout bottomSheetLayout;

private BottomSheetBehavior sheetBehavior;

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    View view = inflater.inflate(R.layout.bottom_sheet, container, false);
    ButterKnife.bind(this, view);
    sheetBehavior = BottomSheetBehavior.from(bottomSheetLayout);
    sheetBehavior.setPeekHeight(R.dimen.peek_height);//put this ub dimens.xml (300dp)
    ArrayList<String> list = new ArrayList<>();
    for (int i = 0; i < 15; i++) {
        list.add("" + i);
    }
    title.setText("Numbers");
    RadioGroup rg = radioGroup;
    for (int i = 0; i < list.size(); i++) {
        RadioButton rbn = new RadioButton(getContext());
        rbn.setId(View.generateViewId());
        String radioButtonText = list.get(i);
        rbn.setText(radioButtonText);
        rg.addView(rbn);
    }
    return view;
}

}

这个解决方案实际上对我有用!欢迎任何改进建议!

【讨论】:

【解决方案2】:

你能试试这个吗,将按钮包裹在嵌套滚动视图之外的相对布局中可能会完成这项工作。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <androidx.core.widget.NestedScrollView
        android:id="@+id/nested_scroll_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <TextView
                android:id="@+id/title"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentTop="true"
                android:layout_marginLeft="20dp"
                android:layout_marginTop="25dp"
                android:layout_marginRight="20dp"
                android:text="" />


            <RadioGroup
                android:id="@+id/radiogroup"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@id/title"
                android:layout_marginLeft="15dp"
                android:layout_marginTop="15dp"
                android:layout_marginBottom="10dp"/>

        </RelativeLayout>

    </androidx.core.widget.NestedScrollView>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.widget.Button
            android:id="@+id/ok"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_gravity="bottom"
            android:layout_marginTop="10dp"
            android:gravity="bottom"
            android:text="OK" />

    </RelativeLayout>

</LinearLayout>

【讨论】:

  • 感谢您的输入兄弟,但它没有模拟我的预期行为..它显示相同..
【解决方案3】:

查看此图:https://proandroiddev.com/android-bottom-sheet-behavior-and-animated-button-on-top-of-it-da86a9bfe545

您需要为底部工作表行为创建一个侦听器并动态更改按钮位置,同时考虑到底部是否被用户滑动

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-07-07
    • 2018-07-02
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多