Lottie-android: Animation max size

[xgear-public]

I have animation with following spec:

  "v": "4.5.6",
  "fr": 25,
  "ip": 0,
  "op": 38,
  "w": 360,
  "h": 146,
  "ddd": 0,
.......

I want to achieve behavior when animation view fits on screen width.
If i set to LottieAnimationView layout_width="match_parent" and layout_height="wrap_content" i faced with following issue on phones:
if phone's width is 1440px(samsung s7), animation viewport width is 1000px because of LottieComposition MAX_PIXELS = 1000 constraint. So i got space between animation and screen edge. I solved this issue by dynamically changing view height to proper value:

DisplayMetrics displayMetrics = getResources().getDisplayMetrics();
        float dpWidth = displayMetrics.widthPixels / displayMetrics.density;
        float dpHeight = displayMetrics.heightPixels / displayMetrics.density;
        mLottieAnimationView.getLayoutParams().height = (int) (displayMetrics.density * 146f / (360f / dpWidth));

After applying new height on view, animation viewport fits screen width well.
So my question is this fix save in terms of stability and performance?
PS: i don't have masks or mattes.

[gpeal]

@xgear-public seems like a reasonable restriction to remove if there are no masks or mattes.

[xgear-public]

If it is possible - it would be great. Furthermore, i think it would convinient to respect LottieView match_parent atribute in this case. I mean fit animation viewport to screen width(height) if json.getInt("w") * composition.scale more (or less) than screen width(height).

[hafs-r]

Im facing similar issue on HTC one, com.airbnb.lottie.LottieAnimationView is always have a max width it doesn't change width even if I give match parent to fit my screen.

[gpeal]

@hafsalrahman I'm not sure I understand your issue. Can you explain it again?

[m1ga]

I think I face the same issue. My layout:

<LinearLayout android:background="#00ffffff" android:layout_height="match_parent" android:layout_width="match_parent" xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools">
    <com.airbnb.lottie.LottieAnimationView
        android:id="@+id/animation_view"
        android:layout_gravity="center"
        android:scaleType="center"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />
</LinearLayout>

And I set this into a view with a fixed width that is higher than the file width. The LottieAnimationView fills out the whole space (setting a background color to prove it) but the animation is still small in the middle of the view.
A "autoScale" switch would be nice to have it fill up the space.

Something like this:
https://github.com/airbnb/lottie-android/blob/413fe8c219fb89a9dcbb0f84f8bd080689d72825/lottie/src/main/java/com/airbnb/lottie/LottieAnimationView.java#L300
but not only for bigger animations

[gpeal]

Use centerCrop instead of center.

On Thu, Mar 16, 2017, 3:54 AM Michael [e-mail] wrote:

I think I face the same issue. My layout:

android:id="@+id/animation_view"
android:layout_gravity="center"
android:scaleType="center"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>

And I set this into a view with a fixed width that is higher than the file
width. The LottieAnimationView fills out the whole space (setting a
background color to prove it) but the animation is still small in the
middle of the view.
A "autoScale" switch would be nice to have it fill up the space

—
You are receiving this because you modified the open/close state.
Reply to this email directly, view it on GitHub
https://github.com/airbnb/lottie-android/issues/112#issuecomment-287022570,
or mute the thread
https://github.com/notifications/unsubscribe-auth/ABP0Yde3C9a6_j7Q-657RR-n2x6txpBWks5rmRTMgaJpZM4MDPiu
.

[m1ga]

👍 I've tested centerInside and it wasn't working. centerCropis working in my case. Thanks

[SirLordPouya]

Hi
I have same problem as m1ga said but none of ScaleTypes work for me.
here is my code
<com.airbnb.lottie.LottieAnimationView android:id="@+id/animation_view" android:layout_width="48dp" android:layout_height="wrap_content" app:lottie_fileName="toggle_switch.json" android:layout_gravity="center" app:lottie_loop="true" app:lottie_autoPlay="true" android:scaleType="centerCrop"/>
the animation stays very little , center of the animationView.

[gpeal]

@SirLordPouya Try setting a fixed height too

[SirLordPouya]

@gpeal tnx but nothing changed.
here is my code again
<com.airbnb.lottie.LottieAnimationView android:id="@+id/animation_view" android:layout_width="48dp" android:layout_height="48dp" android:layout_gravity="center" android:scaleType="centerCrop" app:lottie_autoPlay="true" app:lottie_fileName="toggle_switch.json" app:lottie_loop="true" />
and here is a pic with layout bounds enabled

[candrwow]

I use scaletype=center,it's work,but I don't understand how it work.centercrop/fitxy not work

[MoustafaElsaghier]

any solution about that?
this is my layout code. the image itself becomes smaller and after animate, it becomes larger and animation is distorted

<com.airbnb.lottie.LottieAnimationView android:id="@+id/like_btn" android:layout_width="48dp" android:layout_height="48dp" android:layout_gravity="center" android:scaleType="center" android:src="@drawable/ic_favorite" />