adding svg image to splash screen flutter - flutter

I want to show a svg image in splash screen.
I tried flutter_native_splash package but it's only work with jpg & png. Is there any alternative way to add svg image to splash screen?

You could implement it manually for Android and iOS like described in the docs.
For Android you can use a tool like Respresso to convert your SVG to an Android vector drawable.
Xcode 12 and higher also supports SVG in storyboards as far as I know.

Related

Maui splash screen is not scaled correctly

I'm building a Maui mobile app (android and ios). I have a problem, that my splash screen is not scaled correctly. I have defined it this way in the project csproj file:
<MauiSplashScreen Include="Resources\Images\splashscreen.png" Color="#66B3FF" BaseSize="512,512" />
File format is png and size 482 x 482. The image should be scaled down to fit the screen, but it's cropped at the sides. I have tried with different BaseSize values. The parameter seems to have no effect at all. How can I resize the image to fit the screen? Is there an error in my configuration or is there a bug in Maui?
Edit:
Alternatively, is it possible to disable the default splash screen and use a completely custom, xaml based splash screen in maui?
There is an existed issue about MauiSplashScreen resizetizering issue on the github.
And according to the workaround in it, the image will be resize in the Maui Prject which target is .net 7.0.
So you can try to use the .net 7.0 and add the Resize = "true" in the .csproj such as:
<MauiSplashScreen Include="Resources\Images\splashscreen.png" Color="#66B3FF" BaseSize="512,512" `Resize = "true"`/>
In addition, I have created a new project and set the splash image as a png file which size is 482 x 482. And the image showed correctly.

Integrate flutter background

I am integrating a figma model in flutter.
I have to put the background below.
https://cdn.discordapp.com/attachments/891769943119503452/1072637788882743397/image.png
I first thought to integrate it using the svg generated by figma but I realized that the svg was not supported by flutter natively. So I used the pub dev flutter_svg but my svg contains filters and the filters are not supported by the library.
Is there another way to integrate a svg in flutter? If not, is using a png as a background an appropriate solution?

Flutter android 12 icon

does anyone konow, how to change this ring around the Icon while changing apps? It is everywhere in a diffent colors, like the settingsenter image description here
This is because in android apps icons have a foreground and background. This is referenced here in this question. Might be helpful! How to change the application launcher icon on Flutter?

How to resize image in pub package "flutter_native_splash"?

I am using flutter_native_splash 1.3.1 package to add splash screen to the app. I have two questions here.
Q1. The image size is getting displayed bigger than the desired size on the splash screen. What is right approach to decrease the size of the image on the splash screen?
Q2. How to add text below the image on the splash screen as shown in figma file below?
figma file(desired size)
app screenshot
Q2: You can import the logo and the text together with the export.

Is It possible to set .gif as ionic2 splash screens intead of .png?

I have working on Ionic 2 project and want to set a .GIF image as splash screen .
If it is possible then please guide me how to set the same .
No. Splash screens are converted to platform specific resources, which is displayed while all the Ionic runtime is initializing. Both Android and iOS only supports static images for this.
You may be able to display something cool while performing asynchronous network requests. This has to be after the app is initialized, of course.
It is not possible to do directly, but there are some workarounds, for example using the SVG animation.
Check this tutorial from joshmorony.com:
https://www.joshmorony.com/creating-an-animated-splash-screen-in-ionic/
Hope it helps!