Lottie animation is showing as a still image but not playing - java

I am in the process of writing an app and wanted to have a Lottie animation as my splash screen, since I am learning java as I code this app I made a test app to see how things would work. I found that almost any Lottie animation displays just as a still image and does not play/loop the animation. I followed the guide on LottieFiles website and also information that I found on other questions but I still did not manage to get the animation playing. The following is exactly what I have added:
Gradle dependency of my app:
dependencies {
implementation 'com.airbnb.android:lottie:3.6.1'
}
To my Layout XML:
<com.airbnb.lottie.LottieAnimationView
android:id="#+id/splashlottie"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:lottie_fileName="opening_book.json" //Even tried placing the file in raw and using app:lottie_rawRes="#raw/opening_book"
app:lottie_autoPlay="true"
app:lottie_loop="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
In my activity:
LottieAnimationView splashscreen;
splashscreen = findViewById(R.id.splashlottie);
splashscreen.animate();
splashscreen.playAnimation();
I am not sure exactly what I am doing wrong as I even tried various different lottie animation files and by placing the same file under raw and assets. Could the API level be the cause of the animation not playing?

Looks like you are doing it right. Is there any chance of animations are completely disabled on your phone?

I was able to run the animation with the following code:
val imageView = view.findViewById<LottieAnimationView>(R.id.image_view)
imagView.playAnimation()
xml code:
<com.airbnb.lottie.LottieAnimationView
android:id="#+id/image_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:lottie_fileName="womensDay.json"
app:layout_constraintBottom_toTopOf="#+id/button_first"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textview_first"
app:lottie_loop="true"/>
A few things to remember:
Make sure you're placing your json file in the asset folder, if don't have one create one. Refer: https://stackoverflow.com/a/50907775/5745574
Just to test, try giving your view absolute dimension say 200dp (width & height). It might be a case where your view doesn't have proper dimension.
Try animating a different json file, your file may be corrupted
Try placing your lottieView inside a ViewGroup (Of any type e.g. LinearLayout)
Lottie animation is supported in API level 16 and above

This is work without lottieView.playAnimation() because lottie_autoPlay="true":
<com.airbnb.lottie.LottieAnimationView
android:id="#+id/anim_view"
android:layout_width="256dp"
android:layout_height="256dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:lottie_rawRes="#raw/anim_radio_waves"
app:lottie_autoPlay="true"
app:lottie_loop="true"/>
Also check your animation json: lottie player

Related

why my first app doesn't show up on my phone?

I'm creating my first hello word apps, the first one shows just a hello word test and it worked on my phone, but i put a picture in the second one and run it the phone shows: the app has stopped ; my app looks on the xml design exactly how i wanted it !! (my phone has android 7 and i made the app with android 4)
the picture that i tried to show has a 3096x4128 resolution, but when i tried other picture that has less resolution has worked , i don't know if it's just a coincidence !i tried to change the app's android but same problem!
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
android:src="#drawable/hugo" />
<TextView
android:text="What a Picture!"
android:textSize="36sp"
android:fontFamily="sans-serif-light"
android:textColor="#android:color/white"
android:padding="20dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:text="By AYMEN "
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="20dp"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:fontFamily="sans-serif-light"
android:textSize="36sp" />
I think you are getting OutOfMemory Error. To avoid this you can use the Picasso or Glide libraries
implementation 'com.squareup.picasso:picasso:2.71828'
In Picasso you can use the .fit() method to optimize the image and load it into your ImageView without losing the image quality.
Picasso
.with(context)
.load(UsageExampleListViewAdapter.eatFoodyImages[0])
.fit()
// call .centerInside() or .centerCrop() to avoid a stretched image
.into(imageViewFit);
you have to used image size is less than 2MB. This is the main reason to stop the app. So try to resize it & then used it in ImageView

Creating UI in Android Studio and using it in Unity makes elements jump to 0,0

I made an Activity in Android Studio and added a button in there, added the constraints so the error would go away. When I run an App from Android Studio to my phone, it works fine. When I use an AAR file in Unity and call the activity from there, the buttons jump back to 0,0 like the error said if I did not add constraints, which I did. I'm not getting any errors either as to why it's not able to constraint the button.
Here is how I made the button in my activity.
activity_main.xml
<Button
android:id="#+id/button"
android:layout_width="86dp"
android:layout_height="wrap_content"
android:layout_marginBottom="431dp"
android:layout_marginEnd="130dp"
android:layout_marginStart="168dp"
android:layout_marginTop="32dp"
android:text="#string/StringName"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
I've never really worked with Android Studio UI until now, so I might have forgotten something important here, just hoping one of you guys knows what could be the problem, thanks in advance.
EDIT
The problem is with "app:", everywhere you use it should be replaced with "android:". However android:layout_constraintBottom_toEndOf="parent" doesn't work. Instead you have to use: android:layout_alignParentEnd="true". Also replace "android.support.constraint.ConstraintLayout" with "RelativeLayout".
Unity doesn't work with "app:" for some reason so replacing with "android:" is always necessary. Thanks Soon Santos for telling me about RelativeLayout, I looked at this: https://developer.android.com/guide/topics/ui/layout/relative.html and remembered I had gotten an app: problem before and fixed by changing to android:.
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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="com.Company.MainActivity">
<Button
android:id="#+id/button"
android:layout_width="86dp"
android:layout_height="wrap_content"
android:layout_marginStart="168dp"
android:layout_marginTop="25dp"
android:text="#string/StringName"
android:layout_alignParentEnd="true"
android:layout_alignParentStart="false"/>
</RelativeLayout>
You can actually leave out android:layout_alignParentEnd/Start. With RelativeLayout it seems to not jump back to 0,0 at all, so basically always use android: and RelativeLayout when using Unity (it seems like that at least).
Nothing wrong with the code, it works for me too. Maybe it is because your other way to run the code does not support constraintLayout, you can try RelativeLayout instead and see if it'll work.

Can't get rid of the ugly border around ImageButton

I'm working on an Android App which has a few (Next, Back, ... etc) Buttons which are all round and transparent and I use ImageButton for those Buttons, however the problem is there is always a white border around the Button (I use black background so it is very ugly) and the button never appears to be round is appears as some sort of a square-ish shape.
Here is what I tried so far :
Setting the background of the ImageButton in the activity_mypage.xml file to
android:background="#android:color/transparent"
and to
android:background="?android:selectableItemBackground"
and to
android:background="?android:selectableItemBackgroundBorderless"
even to
android:background="#null"
but nothing seems to work on the .xml side.
and I tried the following on the MyPage.java file :
myBtn.setBackgroundResource(0);
and also
myBtn.setBackground(null);
Nothing seems to work anything I do keeps resulting the same (although it removes a gray border from around the Button but none of them makes the Button completely transparent)
This is a screenshot of the button before applying any of above :
And this is a screenshot of the same Button after applying any of those attributes (doesn't really matter if I applied it only to the xml or only to the java file or to both because all results are the same):
This is my xml code for one of my Buttons in xml :
<ImageButton
android:id="#+id/my_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="26dp"
android:layout_marginEnd="37dp"
android:layout_marginRight="37dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:srcCompat="#mipmap/my_btn"
tools:layout_constraintBottom_creator="1"
tools:layout_constraintRight_creator="1"
android:background="#android:color/transparent"
/>
And here is the code for it in the .java file :
ImageButton myBtn= (ImageButton) findViewById(R.id.my_btn);
myBtn.setBackground(null);
myBtn.setBackgroundResource(0);
I'm really lost at this every result I found for this query has suggested one of the above methods but none of these seems to work for me..
Just change
android:background="#android:color/transparent"
to
android:background="#null"
Try with this
android:src="#mipmap/yourimage"
instead of
app:srcCompat="#mipmap/my_btn"
add this to your button
android:background="#drawable/template"
and create a file name it template in your drawable folder
and add this code to it
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_pressed="true" android:drawable="#drawable/btn2imagePressed"></item>
<item android:drawable="#drawable/btn1imageNotPressed"></item> </selector>
You can use ImageView instead of ImageButton, so background issue will not occur
<ImageView
android:id="#+id/my_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="26dp"
android:layout_marginEnd="37dp"
android:layout_marginRight="37dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent"
android:src="#mipmap/my_btn"
/>
So after reading some of the posted answers and playing around with the suggestions in my code I noticed that the icon was incorrectly loaded into my mipmap directory instead of drawables and that is because when I imported the icons I selected New -> Image Asset instead of Vector Asset which caused my 'icon' to lose its transparency ...
Thanks to everyone for their replies and answers.

Image view doesn't display image if screen is not rotated and an other image view has been updated

Issue
I've got an issue with 2 ImageViews on Android.
The first displays a large image. It is inside a RelativeLayout, and is a custom ImageView (com.ortiz.touch). It was displaying well until now.
The second is also inside the RelativeLayout but is a "normal" ImageView. It shows bluetooth state. Displaying it doesn't cause any issue.
However, when I put code that changes the src of the bluetooth indicator programatically, the first image is not displayed anymore ....
Is the problem coming from the custom view not doing its job right ? Am I missing something ?
Code
If I'm not doing this kind of stuff :
bluetoothState.setImageResource(R.drawable.bluetooth_enabled192);
The image is displayed correctly.
Here's the layout I use :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#1b1b1b"
android:theme="#style/Theme.AppCompat.Light.NoActionBar.FullScreen">
<com.ortiz.touch.TouchImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/imageView"
android:layout_gravity="center"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_above="#+id/textView" />
<TextView
android:layout_width="fill_parent"
android:layout_height="32dp"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="#string/emptyDisplayText"
android:layout_gravity="center_horizontal|bottom"
android:gravity="center_vertical|center_horizontal"
android:textAllCaps="true"
android:elegantTextHeight="false"
android:ellipsize="end"
android:maxLines="1"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:textSize="15sp"
android:textColor="#f3f3f3"
android:id="#+id/textView"
android:background="#drawable/rounded_rect"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentBottom="true"
android:layout_margin="10dp" />
<ImageView
android:layout_width="52dp"
android:layout_height="52dp"
android:id="#+id/bluetooth_state"
android:scaleType="centerCrop"
android:layout_alignParentTop="true"
android:layout_alignRight="#+id/textView"
android:layout_alignEnd="#+id/textView"
android:layout_gravity="top|right"
android:layout_margin="10dp"/>
</RelativeLayout>
Desired Result
What I get is the same screen without the central image (the text and bluetooth indication are displayed correctly)
 NB
I'm starting to get quite depressed on that issue. I just want to display 2 images. Thank you.
Edit
I've not mentioned it, but the main image is loaded in background, using an AsyncTask. I've tried to add some View.invalidate() (on top level layout, on image, on bluetooth indication) but it hasn't solved the problem.
In addition to the image appearing on rotation, it also appears when I try to pinch the non-existant image. And trying to reset the zoom (hacky) programatically doesn't work either.
Okay I've found the error.
As I said, I have a AsyncTask (BitmapWorkerTask) that I call to load a Bitmap into an ImageView in background.
It's called like this :
new BitmapWorkerTask(imageView, getApplicationContext()).execute(filename);
Changing getApplicationContext() to MainActivity.this or getContext() solves the issue :/ (However, I still find it's quite magic how it worked fine for so long even if application context != activity context !)

Android Studio 0.8.9 How to change buttons shape?

I've seen most of post # stackoverflow and i've done as told.
Create new xml (tried a few different samples)
But i can't change the background in activity xml, it does not want to find "#drawable/shape"
I have the new xml in right folder and I'm struggling with it since this morning. I'd be more than glad to see some help ;)
Sorry, I've got it like that:
'
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/chest"
android:id="#+id/button"
android:textColor="#android:color/black"
android:layout_gravity="center"
android:textSize="23sp"
android:layout_toStartOf="#+id/maxWagi"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_toLeftOf="#+id/maxWagi"
android:background="#drawable:button_shape"'
// <----- if I change it to some #color it's working just fine.
and my xml button_shape is in app\src\main\res\xml\ (android studio put it over there by itself) I even added manually drawable folder like in most tutorials but it does not change anything
You have syntax mistake. Your background should be #drawable/button_shape instead of #drawable:button_shape. Also put in a drawable folder in res.

Categories

Resources