I have a listview inside constraint layout. When it has more lists, want to restrict the parent layout height. How can I set max layout height programmatically for bottom_layout? Display a maximum of 80% of device height.
This is the layout:
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/bottom_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<Button
android:id="#+id/try_again"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/primary_button"
android:minWidth="180dp"
android:text="#string/error_try_again"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<ListView
android:id="#+id/instruction_list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="#+id/try_again"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/instruction_subtitle" />
<TextView
android:id="#+id/instruction_subtitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAlignment="center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<TextView
android:id="#+id/instruction_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/instruction_title"
app:layout_constraintBottom_toTopOf="#+id/instruction_subtitle"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Tried this solution on calling onCreate but didn't work:
private void BottomCardHeight(){
DisplayMetrics metrics = Resources.getSystem().getDisplayMetrics();
float density = metrics.density;
float device_height = metrics.heightPixels / density;
bottom_layout = findViewById(R.id.bottom_layout);
ConstraintSet set = new ConstraintSet();
set.clone(bottom_layout);
set.constrainMaxHeight(R.id.bottom_layout, (int) (device_height * 0.8));
// set.constrainHeight(R.id.bottom_layout, (int) (device_height * 0.8)); both not working
set.applyTo(bottom_layout);
//ConstraintLayout mConstrainLayout = (ConstraintLayout) findViewById(R.id.bottom_layout);
//ConstraintLayout.LayoutParams lp = (ConstraintLayout.LayoutParams) mConstrainLayout.getLayoutParams();
//lp.matchConstraintMaxHeight = (int) (device_height * 0.8);
//mConstrainLayout.setLayoutParams(lp);
}
You can you do this on layout by wrapping the ConstraintLayout in another one that has a height that matches the screen height.
Then add the below constraints to the inner ConstraintLayout to get a max height of 80% of the total screen height. This requires to have a height that match constraints
android:layout_height="0dp"
app:layout_constraintHeight_max="wrap"
app:layout_constraintHeight_percent="0.8"
So, the outer layouts would be:
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/bottom_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_max="wrap"
app:layout_constraintHeight_percent="0.8"
app:layout_constraintStart_toStartOf="parent">
<!-- other views -->
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Related
I am trying to place a moveable TextView inside of an ImageView such that the TextView should listen to my touch movement and move accordingly but should remain within the borders of the ImageView.
I have the below XML code where I am using Github library ZoomageView:
`<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ImageEditActivity"
android:background="#color/primary_dark">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/text_edit_tab"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:menu="#menu/text_edit_tab_menu"
app:itemIconTint="#drawable/icon_selector"
app:itemTextColor="#drawable/icon_selector"
android:elevation="5dp"
android:background="#color/colour_transparent"/>
<com.jsibbold.zoomage.ZoomageView
android:id="#+id/edit_image_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="#+id/text_edit_tab"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.5"
android:src="#mipmap/ic_launcher"
tools:layout_editor_absoluteX="100dp"
/>
<TextView
android:id="#+id/move_quote_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dp"
android:text="#string/what_s_on_your_mind"
app:layout_constraintBottom_toTopOf="#+id/text_edit_tab"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:textColor="#color/teal_200"
android:textSize="16sp"
android:visibility="gone"/>
<View
android:id="#+id/blurred_background"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#color/colour_semi_transparent"
app:layout_constraintBottom_toTopOf="#id/text_edit_tab"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0" />
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/quote_text"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:layout_marginHorizontal="30dp"
app:layout_constraintTop_toTopOf="#id/edit_image_view"
app:layout_constraintBottom_toBottomOf="#id/edit_image_view"
android:hint="#string/what_s_on_your_mind"
android:textColorHint="#color/white"
android:textAlignment="viewStart"
android:paddingHorizontal="10dp"
android:textSize="18sp"
android:paddingVertical="10dp"
android:background="#drawable/quote_text_background"
/>
<Button
android:id="#+id/done_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:backgroundTint="#color/primary_red"
android:text="#string/next"
android:textColor="#color/white"
android:textSize="14sp"
android:layout_marginBottom="10dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/quote_text"
android:layout_marginTop="20dp"
android:layout_marginEnd="20dp"/>
</androidx.constraintlayout.widget.ConstraintLayout>
I am using the below function - isQuoteInsideImage() to get the location of my TextView w.r.t the ImageView :
`private boolean isQuoteInsideImage(float x, float y, ZoomageView view) {
int[] location = new int[2];
view.getLocationOnScreen(location);
int viewX = location[0];
int viewY = location[1];
return ((x > viewX && x < (viewX + view.getWidth())) && (y > viewY && y < (viewY + view.getHeight())));
}`
And the below code : `
moveQuoteText.setOnTouchListener((view, motionEvent) -> {
if (motionEvent.getAction() == MotionEvent.ACTION_MOVE) {
if (isQuoteInsideImage(moveQuoteText.getX(), moveQuoteText.getY(), editZoomageView)) {
view.setX(motionEvent.getRawX() - view.getWidth());
view.setY(motionEvent.getRawY() - view.getHeight());
}
}
return true;
});`
However, whenever I am trying to drag the TextView, the TextView goes out of the lower bounds and the Left Bounds. It however remains restricted at some distance from the upper bound.
Upper bound
Lower bound
What am I doing wrong and what should be done to make the TextView remain in the bound of the ImageView?
I need my Dialog width and height fill 70% of screen space. I'm using ConstraintLayout as root layout and tried to achieve this by using app:layout_constraintWidth_percent but it's not working.
It would be great to achieve this in XML without Java code.
Here is my code:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#drawable/dialog_background_shape"
android:padding="#dimen/app_padding">
<TextView
android:id="#+id/textView13"
style="#style/text_plain3"
android:textStyle="bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="0dp"
android:layout_marginTop="0dp"
android:text="#string/add_member_title"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/button_add_member_close"
style="#style/text_title2"
android:textStyle="bold"
android:layout_width="28dp"
android:layout_height="28dp"
android:background="#drawable/button_dialog_close"
android:gravity="center"
android:text="X"
android:textColor="#color/text_plain3"
android:textSize="20sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="HardcodedText" />
<TextView
android:id="#+id/add_member_group_id"
style="#style/text_group_id"
android:layout_width="250dp"
android:layout_height="wrap_content"
android:layout_marginStart="32dp"
android:layout_marginTop="64dp"
android:layout_marginEnd="32dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView13" />
<TextView
android:id="#+id/textView17"
style="#style/text_card"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="#string/add_member_annotation"
app:layout_constraintStart_toStartOf="#+id/add_member_group_id"
app:layout_constraintTop_toBottomOf="#+id/add_member_group_id"/>
<EditText
android:id="#+id/add_member_user_id"
android:layout_width="248dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:ems="10"
android:hint="#string/add_member_hint_id"
android:importantForAutofill="no"
android:inputType="textPersonName"
android:maxLength="28"
app:layout_constraintEnd_toEndOf="#+id/add_member_group_id"
app:layout_constraintStart_toStartOf="#+id/add_member_group_id"
app:layout_constraintTop_toBottomOf="#+id/textView17" />
<Button
android:id="#+id/button_add_member"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="48dp"
android:layout_marginBottom="48dp"
android:text="#string/add_member_button_add"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="#+id/add_member_group_id"
app:layout_constraintStart_toStartOf="#+id/add_member_group_id"
app:layout_constraintTop_toBottomOf="#+id/add_member_user_id"/>
</androidx.constraintlayout.widget.ConstraintLayout>
In order to have a constraint width/height DialogFragment or (any specific width or height in general):
wrap your ConstraintLayout into another ConstraintLayout in order to make the outer take the full size of the screen, and the inner get the desired width/height percentage:
Make the android:background of the outer to be transparent
Constraint the width & height of the inner ConstraintLayout, make it centered in parent, and add the percentage constraint to the width & height:
app:layout_constraintHeight_percent="0.7"
app:layout_constraintWidth_percent="0.7"
Now the layout looks like:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/transparent">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/main_layout"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_gravity="center"
android:background="#drawable/dialog_background_shape"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_percent="0.7"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintWidth_percent="0.7"
android:padding="#dimen/app_padding">
<TextView
android:id="#+id/textView13"
style="#style/text_plain3"
android:textStyle="bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="0dp"
android:layout_marginTop="0dp"
android:text="#string/add_member_title"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/button_add_member_close"
style="#style/text_title2"
android:textStyle="bold"
android:layout_width="28dp"
android:layout_height="28dp"
android:background="#drawable/button_dialog_close"
android:gravity="center"
android:text="X"
android:textColor="#color/text_plain3"
android:textSize="20sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="HardcodedText" />
<TextView
android:id="#+id/add_member_group_id"
style="#style/text_group_id"
android:layout_width="250dp"
android:layout_height="wrap_content"
android:layout_marginStart="32dp"
android:layout_marginTop="64dp"
android:layout_marginEnd="32dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView13" />
<TextView
android:id="#+id/textView17"
style="#style/text_card"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="#string/add_member_annotation"
app:layout_constraintStart_toStartOf="#+id/add_member_group_id"
app:layout_constraintTop_toBottomOf="#+id/add_member_group_id" />
<EditText
android:id="#+id/add_member_user_id"
android:layout_width="248dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:ems="10"
android:hint="#string/add_member_hint_id"
android:importantForAutofill="no"
android:inputType="textPersonName"
android:maxLength="28"
app:layout_constraintEnd_toEndOf="#+id/add_member_group_id"
app:layout_constraintStart_toStartOf="#+id/add_member_group_id"
app:layout_constraintTop_toBottomOf="#+id/textView17" />
<Button
android:id="#+id/button_add_member"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="48dp"
android:layout_marginBottom="48dp"
android:text="#string/add_member_button_add"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="#+id/add_member_group_id"
app:layout_constraintStart_toStartOf="#+id/add_member_group_id"
app:layout_constraintTop_toBottomOf="#+id/add_member_user_id" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
In your custom DialogFragment:
Designate the width & height of the dialog to MATCH_PARENT:
dialog?.window?.setLayout(
LinearLayout.LayoutParams.MATCH_PARENT,
LinearLayout.LayoutParams.MATCH_PARENT
)
Set no background the theme:
<style name="NoBackgroundDialogTheme" parent="Theme.AppCompat.Light.Dialog">
<item name="android:windowBackground">#null</item>
</style>
Custom Dialog Fragment:
Java:
public class MyDialogFragment extends DialogFragment {
#Nullable
#org.jetbrains.annotations.Nullable
#Override
public View onCreateView(#NonNull #NotNull LayoutInflater inflater, #Nullable #org.jetbrains.annotations.Nullable ViewGroup container, #Nullable #org.jetbrains.annotations.Nullable Bundle savedInstanceState) {
return inflater.inflate(
R.layout.dialog_layout, container,
false
);
}
#Override
public int getTheme() {
return R.style.NoBackgroundDialogTheme;
}
#Override
public void onStart() {
// Making the dialog full screen
if (getDialog() != null)
getDialog().getWindow().setLayout(
LinearLayout.LayoutParams.MATCH_PARENT,
LinearLayout.LayoutParams.MATCH_PARENT
);
super.onStart();
}
}
Kotlin:
class MyDialogFragment : DialogFragment() {
override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?
): View {
return inflater.inflate(
R.layout.dialog_layout, container,
false
)
}
override fun getTheme(): Int = R.style.NoBackgroundDialogTheme
override fun onStart() {
super.onStart()
// Making the dialog full screen
dialog?.window?.setLayout(
LinearLayout.LayoutParams.MATCH_PARENT,
LinearLayout.LayoutParams.MATCH_PARENT
)
}
}
Note: I am assuming that the dialog layout is R.layout.dialog_layout
UPDATE
now if I click on empty space around the Dialog, it doesn't close.
This is because the dialog fragment consumes the entire screen size; you can solve this by the below workaround:
Add an ID to the outer most ConstraintLayout, assume it is root >> Updated on the top layout
Add an ID to the inner ConstraintLayout, assume it is main_layout >> Updated on the top layout
Dismiss the dialog when the root is clicked
Do nothing when the main_layout is clicked to consume the event so that it won't be dismissed:
So, update the onStart() of the MyDialogFragment to:
override fun onStart() {
super.onStart()
// Making the dialog full screen
dialog?.window?.setLayout(
LinearLayout.LayoutParams.MATCH_PARENT,
LinearLayout.LayoutParams.MATCH_PARENT
)
val root = requireView().findViewById<ConstraintLayout>(R.id.root)
root.setOnClickListener {
dismiss() // Dismiss the dialog
}
val main = requireView().findViewById<ConstraintLayout>(R.id.main_layout)
main.setOnClickListener {
// Consume the event
}
}
ConstraintLayout:
I see your "Dialog" Box contains a lot of different views. For that I made a simple example for you to show how to use Guideline for achieving percentages of Views.
I suggest to learn how this works and rebuild your layout with better constraining on this Guidelines, because now everything is wired up really bad. The idea will be to wire the ConstraintLayout to the Guideline and everything beside that (e.g. TextView etc.) to the ConstraintLayout. (Without Hardcoding!, that's how relative design work).
My example shows a TextView (could be your ConstraintLayout (frame for everything) that has exactly 70% (app:layout_constraintGuide_percent="0.7") vertically and horizontal of the screen. Important is to set the TextViews width and height to 0dp and to attach to the Guideline:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.constraintlayout.widget.Guideline
android:id="#+id/vertical_guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.7" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/horizontal_guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.7" />
<TextView
android:id="#+id/textView"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#2962FF"
app:layout_constraintBottom_toTopOf="#+id/horizontal_guideline"
app:layout_constraintEnd_toStartOf="#+id/vertical_guideline"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:text="TextView" />
</androidx.constraintlayout.widget.ConstraintLayout>
Result:
In addition same for LinearLayout:
You can use android:layout_weight="" to give a percent amount. So 70% means a weight of .70.
Keep in mind to set the width or/and height to 0dp
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:text="70 percent of screen"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight=".70" />
</LinearLayout>
I have a bottom navigation bar and a bottom sheet above it. The bottom sheet can be expanded to fill the entire screen and I would like to add an animation that hides the bottom navigation bar as the bottom sheet is expanded. Below are screenshots of my layout, the expanded image shows what it currently looks like and the desired image shows what I want it to look like. I have looked in the bottom sheet documentation but I could not find anything useful.
Collapsed: https://i.imgur.com/B4rVGzn.png
Expanded: https://i.imgur.com/Z25I2h0.png
Desired: https://i.imgur.com/PsE06gQ.png
Below is my layout
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/constraintLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/navigation_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:backgroundTint="?attr/colorSurface"
android:elevation="16dp"
app:layout_constraintBottom_toBottomOf="parent"
app:menu="#menu/bottom_nav_menu">
</com.google.android.material.bottomnavigation.BottomNavigationView>
<fragment
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
app:cameraZoom="13.8"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:context=".MainActivity" />
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:id="#+id/coordinatorLayout"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/navigation_bar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:elevation="16dp" >
<include layout="#layout/bottom_sheet" />
<LinearLayout
android:id="#+id/floating_action_buttons"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:clipToPadding="false"
android:gravity="center"
android:orientation="vertical"
android:padding="16dp"
app:layout_behavior="jonathan.gpsapp.FloatingButtonBehavior">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/center_map"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:clickable="true"
android:src="#drawable/ic_center"
app:backgroundTint="?attr/colorSurface"
app:fabSize="mini"
app:tint="?attr/colorPrimary" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/record"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:src="#drawable/ic_record"
app:backgroundTint="?attr/colorPrimary"
app:fabSize="auto"
app:tint="#f2f2f2" />
</LinearLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</androidx.constraintlayout.widget.ConstraintLayout>```
You need to use the addBottomSheetCallback to listen the slide position of your BotomSheet and with this value you can hide the BottomNavigation smoothly :
private int navigationHeight;
bottomSheet.addBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {
#Override
public void onStateChanged(#NonNull View bottomSheet, int newState) {
}
#Override
public void onSlide(#NonNull View bottomSheet, float slideOffset) {
if (navigationHeight == 0)
navigationHeight = navigation.getHeight(); //the height of the navigationView
float slideY = navigationHeight - navigationHeight * (1 - slideOffset);
navigation.setTranslationY(slideY);//Translate the navigatinView
}
});
Note: for a good result you must move the bottom Navigation on the coordinatorlayout
I have downloaded a library from Github - https://github.com/riyagayasen/Android_accordion_view and added it as a module to my project.
I want to change the layout of the view, because the default one doesn't quite suit my design. By default it looks like this: https://pp.userapi.com/c855132/v855132038/18192/AJnXb6Z7l4c.jpg; I want it look like this: https://pp.userapi.com/c855132/v855132038/18178/VyKEhn6ERuk.jpg; but all i have achieved is this: https://pp.userapi.com/c848416/v848416709/1602db/3JjKU9eMj0g.jpg.
It is clear that I have to change the layout of the AccordionView.
The path to the layout XML is Android_accordion_view/easyaccordion/src/main/res/layout/accordion.xml
I am sure that AccordionView uses exactly this layout because there is a method in AccordionView.java that inflates this XML as a layout:
private void initializeViews(Context context) {
inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
//here it happens
LinearLayout accordionLayout = (LinearLayout) inflater.inflate(R.layout.accordion, null);
partition = accordionLayout.findViewById(R.id.partition);
heading = (TextView) accordionLayout.findViewById(R.id.heading);
paragraph = (RelativeLayout) accordionLayout.findViewById(R.id.paragraph_layout);
dropdownImage = (ImageView) accordionLayout.findViewById(R.id.dropdown_image);
dropupImage = (ImageView) accordionLayout.findViewById(R.id.dropup_image);
headingLayout = (LinearLayout) accordionLayout.findViewById(R.id.heading_layout);
paragraph.removeAllViews();
int i;
children = new View[getChildCount()];
for (i = 0; i < getChildCount(); i++) {
children[i] = getChildAt(i);
}
removeAllViews();
for (i = 0; i < children.length; i++) {
paragraph.addView(children[i]);
}
paragraphBottomMargin = ((LinearLayout.LayoutParams) paragraph.getLayoutParams()).bottomMargin;
paragraphTopMargin = ((LinearLayout.LayoutParams) paragraph.getLayoutParams()).topMargin;
addView(accordionLayout);
}
The problem is that if I change accordion.xml, nothing actually changes when I add the AccordionView to my fragment's layout, and that's super weird.
I assume that I have somehing wrong in Gradle dependences or somewhere near it, but I can't figure it out.
That is the xml that I want to change the default layout to.
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:background="#drawable/accordion_background"
android:layout_height="wrap_content">
<android.support.constraint.ConstraintLayout
android:id="#+id/heading_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<CheckBox
android:id="#+id/favourite_checkBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="2dp"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:button="#drawable/star_checkbox"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toEndOf="#+id/heading"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/dropup_image"
android:layout_width="34dp"
android:layout_height="26dp"
android:layout_marginTop="2dp"
android:scaleType="fitCenter"
android:src="#drawable/ic_arrow_up"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="#+id/favourite_checkBox"
app:layout_constraintStart_toStartOf="#+id/favourite_checkBox"
app:layout_constraintTop_toBottomOf="#+id/favourite_checkBox" />
<ImageView
android:id="#+id/dropdown_image"
android:layout_width="0dp"
android:layout_height="18dp"
android:layout_marginTop="2dp"
android:layout_marginBottom="2dp"
android:scaleType="fitCenter"
android:src="#drawable/ic_arrow_down"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="#+id/favourite_checkBox"
app:layout_constraintStart_toStartOf="#+id/favourite_checkBox"
app:layout_constraintTop_toBottomOf="#+id/favourite_checkBox" />
<TextView
android:id="#+id/heading"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:text="Title"
android:textStyle="bold"
android:visibility="visible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:id="#+id/partition"
android:background="#android:color/darker_gray" />
<RelativeLayout
android:id="#+id/paragraph_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:animateLayoutChanges="true"
android:orientation="vertical"
android:paddingTop="10dp"
android:visibility="visible"
tools:visibility="visible">
</RelativeLayout>
</LinearLayout>
Yes, I understand that the heading layout is LinearLayout by default, but even if I change the dropdown icon size in the default layout, it stays the same when I use the view.
So my question is: how can I make the layout above appear when I use the view?
I will provide any of my code by your request.
Thank you.
I have a ConstraintLayout that contains a ViewStub with the app:constraintHeight_default property set to spread in XML. I need to be able to update this property to have a value of wrap at runtime, but so far nothing has worked for me. Here is the layout:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/constraint_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipChildren="false"
android:clipToPadding="false"
>
<ViewStub
android:id="#+id/view_stub"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/bottom_view"
app:layout_constraintTop_toBottomOf="#+id/top_view"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_default="spread"
/>
<com.example.TopView
android:id="#+id/top_view"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#id/view_stub"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_default="wrap"
/>
<com.example.BottomView
android:id="#+id/bottom_view"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/fields_stub"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_default="wrap"
/>
So far, I've tried using a ConstraintSet to set constraintHeight_default programmatically, but the layout inflated from the ViewStub ends up having 0 width and 0 height, so it isn't rendered in the layout.
ConstraintLayout constraintLayout = root.findViewById(R.id.constraint_layout);
ConstraintSet constraintSet = new ConstraintSet();
constraintSet.clone(constraintLayout);
constraintSet.constrainHeight(R.id.view_stub, ConstraintSet.MATCH_CONSTRAINT_WRAP);
constraintSet.applyTo(constraintLayout);
ViewStub viewStub = root.findViewById(R.id.view_stub);
viewStub.setLayoutResource(R.layout.custom_layout);
viewStub.inflate();
How can I set the height of the ViewStub to wrap its height programmatically?
Try changing the following line:
constraintSet.constrainHeight(R.id.view_stub, ConstraintSet.MATCH_CONSTRAINT_WRAP);
to constrainDefaultHeight
constraintSet.constrainDefaultHeight(R.id.view_stub, ConstraintSet.MATCH_CONSTRAINT_WRAP);
See the ConstraintSet documentation.
constrainDefaultHeight
void constrainDefaultHeight (int viewId,
int height)
Sets how the height is calculated ether MATCH_CONSTRAINT_WRAP or MATCH_CONSTRAINT_SPREAD. Default is spread.