Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Flexbox not respecting children margins #356

Closed
barnaclejive opened this issue Sep 13, 2017 · 5 comments
Closed

Flexbox not respecting children margins #356

barnaclejive opened this issue Sep 13, 2017 · 5 comments
Assignees
Milestone

Comments

@barnaclejive
Copy link

This was mentioned before in #86, but that issue was closed because the original reporter did not respond. Since then, a couple other people and myself have had the same issue. I am not able to re-open the issue myself so I have created this new issue.

Here is the specific scenario I have:

  • Adding TextView children to a FlexboxLayout.
  • Margin set on the TextViews is not respected by the FlexboxLayout when set programmatically. It does work when margin is set on the TextViews in a layout file using android:layout_margin. However, this is not useful when the TextViews need to be created and added to the FlexboxLayout dynamically.
  • I have included my Activity's layout file, the function to add TextViews, and a screenshot of the result.
  • FlexBoxLayout Version 0.3.0
  • app compileSdkVersion 26
  • app minSdkVersion 16
  • app targetSdkVersion 26
  • device Google Pixel on 7.1.0 (25)

`
<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/container"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<include layout="@layout/include_toolbar"/>

<com.google.android.flexbox.FlexboxLayout
    android:id="@+id/tagListView"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:layout_constraintTop_toBottomOf="@id/appbar"
    app:layout_constraintBottom_toTopOf="@id/filterList"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:flexWrap="wrap"
    app:alignItems="flex_start"
    >

</com.google.android.flexbox.FlexboxLayout>

<android.support.v7.widget.RecyclerView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/filterList"
    android:layout_width="0dp"
    android:layout_height="0dp"
    app:layout_constraintTop_toBottomOf="@id/tagListView"
    app:layout_constraintBottom_toTopOf="@id/bottomContainer"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    />

<android.support.v7.widget.LinearLayoutCompat
    android:id="@+id/bottomContainer"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:layout_constraintTop_toBottomOf="@id/filterList"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    >

    <android.support.v7.widget.AppCompatButton
        android:id="@+id/applyFiltersButton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="@dimen/margin_normal"
        android:layout_marginRight="@dimen/margin_normal"
        android:layout_marginTop="@dimen/margin_half"
        android:layout_marginBottom="@dimen/margin_half"
        android:theme="@style/ButtonGreen"
        android:text="@string/filter_apply"
        />

</android.support.v7.widget.LinearLayoutCompat>

</android.support.constraint.ConstraintLayout>
`

Code to programmatically create a TextView with margin and add it to the FlexBoxLayout (Kotlin).

`private fun insertTag(facetValue: FacetValue) {

    val layoutParams = ViewGroup.MarginLayoutParams(ViewGroup.MarginLayoutParams.WRAP_CONTENT, ViewGroup.MarginLayoutParams.WRAP_CONTENT)
    layoutParams.setMargins(50, 50, 50, 50)

    val tagView = TextView(this)
    tagView.layoutParams = layoutParams
    tagView.text = facetValue.name
    tagView.setPadding(
        resources.getDimension(R.dimen.margin_normal).toInt(),
        resources.getDimension(R.dimen.margin_half).toInt(),
        resources.getDimension(R.dimen.margin_normal).toInt(),
        resources.getDimension(R.dimen.margin_half).toInt())
    tagView.setViewBackgroundCompat(R.drawable.notification_discount_closeout)
    tagView.setTextColor(ContextCompat.getColor(FlagshipApplication.getAppContext(), R.color.discount_closeout))

    tagListView.addView(tagView)
}`

bad

@thagikura
Copy link
Contributor

Thanks for opening this issue. Let me take a look

@thagikura
Copy link
Contributor

This should be fixed by #359

@thagikura thagikura added this to the 0.3.1 milestone Sep 25, 2017
@barnaclejive
Copy link
Author

Thanks @thagikura

@Swaini
Copy link

Swaini commented Sep 25, 2017

Change "val layoutParams = ViewGroup.MarginLayoutParams(ViewGroup.MarginLayoutParams.WRAP_CONTENT, ViewGroup.MarginLayoutParams.WRAP_CONTENT)
layoutParams.setMargins(50, 50, 50, 50)"
To

	val dp = resources.displayMetrics.density.toInt()
	val layoutParams = **FlexboxLayout**.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT)
	layoutParams.setMargins(50 * dp, 50 * dp, 50 * dp, 50 * dp)

@AndroidDeveloperLB
Copy link

@Swaini Also, if it's in RecyclerView, use FlexboxLayoutManager.LayoutParams instead.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants