Animated Splash Screen - Android Studio Tutorial - (Java, Android Studio, Adobe Xd, Shapeshifter) смотреть онлайн

If you want to hire me as a freelancer, please contact me.

Email: [email protected]
Whatsapp: https://api.whatsapp.com/send?phone=905524192520
Telegram: t.me/ixastudio
Website: https://ixastudio.com

Donate: https://iyzi.link/AFr5ag

source code:
https://github.com/isacoskun/SplashScreenTutorial

shapeshifter:
https://shapeshifter.design/

adobe xd:
https://helpx.adobe.com/tr/xd/get-started.html

android studio:
https://developer.android.com/studio

Hello, in this video, I will show you how to make an animated splash screen using java programming language with android studio.

Before starting the tutorial, I apologize for the poor resolution. The image quality will be better than the next videos. I saw the design in this tutorial on dribble and developed it for android studio so that it can be used in native applications. First, I drew the design in this experiment as a vector using adobe xd, then I converted this vector to animation using "shapeshifter". Then I wrote the necessary codes on the android side and created the animated splash screen. I shared the github link for the source codes of the project under the video. In addition, if you write the animated examples that you want me to do as a trial and you see on dribbble as a comment under the video, I can do it in android studio in my next trial video.

I draw the sample design on Adobe Xd using the pen tool in accordance with the design rules and export it as .svg. The positions of the layers are very important, otherwise we may experience problems while animating with shapeshifter.

Now I won't speed up the video and keep you waiting any longer, but I want you to see all the steps.

After the vector drawing is finished, we import the svg file in shapeshifter and create the necessary animation. Since animating with Shapeshifter is a different matter, I'm going through this place quickly.

Let's code.

First, let's create a new project in android studio. Next, let's create an activity called SplashActivity.

I'm creating a demo screen for MainActivity, which will come after SplashActivity next. You don't need to do this.

Then I create a folder called events and move the events there so that the events look collective and professional. It's not necessary for you to do this.

In the part where the application name appears on the opening screen, the texts come in sequence with a fluid animation, letter by letter. In order to do this we must create a TypeWriter class. Then, we must determine a waiting period for each letter that we will use in each letter text and print these letters on the screen one by one.

After writing our TypeWriter class, we will write a different class to make the splash screen appear full screen. With this class we will hide the soft and status bar and the design will fill the screen.

Then we will arrange the layout for SplashActivity in accordance with the design. Here we will call the TypeWriter class we created and copy the animation we created with Shiftsihfter to the drawable directory of the project. After copying we will add this xml file using ImageView. If you want the design to look exactly the same and professional for you, follow these steps carefully and do not forget to add the animated xml file and the appropriate font in the design to the source locations in the project.

Then we write the necessary codes for the TypeWriter, fadein, animated vector in the SplashActivity class and create a function that opens the other activity after a few seconds with a simple delay. I do not go into detailed explanations because it is difficult to edit videos and because of my bad English. I don't think this will be a problem as I will share the code of the project. You can better understand the codes by examining them and using them in your own experiments. If you leave comments for the parts you don't understand and the parts you have problems with, I will help you as much as possible.

Now it's test time. I am using a real device for testing and mirroring the screen to the computer.

I think this tutorial will be ideal for beginner and intermediate developers. Since I shared the codes, you can quickly use them in your projects.

I'm thinking of making a video series like this video. If you see a very different and striking splash screen example, please comment below this video and post a link. So I can make the design you posted in the other tutorial and share the codes. Thanks for watching. Don't forget to support me.