Different behavior from css flexbox when center aligned item has margin on one side

[andrey-shikhov]

css flexbox snippet:
https://gist.github.com/andrey-shikhov/f003d6c82ed307f6a1e24786207fcbeb

Result:

Android snippet:
`

    <LinearLayout android:layout_width="100dp"
                  android:orientation="horizontal"
                  android:layout_height="20dp">

            <View
                android:layout_width="10dp"
                android:layout_height="match_parent"
                android:background="#fff"
                />

            <View
                android:layout_width="10dp"
                android:layout_height="match_parent"
                android:background="#000"
                />

            <View
                android:layout_width="10dp"
                android:layout_height="match_parent"
                android:background="#fff"
                />

            <View
                android:layout_width="10dp"
                android:layout_height="match_parent"
                android:background="#000"
                />

            <View
                android:layout_width="10dp"
                android:layout_height="match_parent"
                android:background="#fff"
                />

            <View
                android:layout_width="10dp"
                android:layout_height="match_parent"
                android:background="#000"
                />

            <View
                android:layout_width="10dp"
                android:layout_height="match_parent"
                android:background="#fff"
                />

            <View
                android:layout_width="10dp"
                android:layout_height="match_parent"
                android:background="#000"
                />

            <View
                android:layout_width="10dp"
                android:layout_height="match_parent"
                android:background="#fff"
                />

            <View
                android:layout_width="10dp"
                android:layout_height="match_parent"
                android:background="#000"
                />

    </LinearLayout>

    <com.google.android.flexbox.FlexboxLayout     xmlns:android="http://schemas.android.com/apk/res/android"
                                              android:layout_width="100dp"
                                              xmlns:app="http://schemas.android.com/apk/res-auto"
                                              app:flexDirection="column"
                                              android:layout_height="20dp">

            <View
                android:layout_width="20dp"
                android:layout_height="match_parent"
                android:layout_marginRight="20dp"
                android:background="#7b7bb9"
                app:layout_alignSelf="center"
                />

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

</LinearLayout>

`
Result:

Seems to be css flexbox includes margin into the size of the item and after centers it, but in android flexbox centers item before and after applies margin.

Expected behavior:
same on both platforms.

[thagikura]

Hi, thanks for pointing this out!
Confirmed it diverges from the original css flexbox.

I'll mark this as a bug, and will fix this shortly.