Interacting with SVG file to change color on tap - flutter

I have an SVG file, how can i interact with it and change color of different portions of SVG file.
I am trying this thing very first time, and i am confused how to achieve it. Any possible and step by step solutions?
TIA

Related

Is there any way to create a PDF from a widget using Flutter?

I did some research and find out that you can create PDF with images or texts or by exporting the screenshot, but I want to create much more like in the image below:
So what I want to achieve is to have a good resolution for PDF to print the PDF as a book after this. The physical book has a lot of pages and my client wants to create the virtual one.
So, I have the design (as you can see in the image), but I still need to create some text fields, signature and some logic in the widget.
How can I export after that to a one page PDF for every widget?
Screenshot won't be enough because I think it doesn't have a good quality and ofc the text and everything else won't be suited in the phone screen.
I am thinking to use the basic design and to add manually by code the texts, but I don't know how to export this to a PDF after that.
Of Course! The pdf package is a great start.

..net maui splash screen change not displaying correctly

I'm experimenting with .net maui. i'm using vs 17.3 preview 4. I'd like to change the spash screen. i would think that i would change the content of the spash.svg file. I've changed the content of the file. I've left the property of the file as mauispashscreen. I've created a simple png file and have converted it with an online svg converter. the file is viewable with msft edge browser. All i get is a purple screen without the text changes. I'm just trying to do something simple. what should i look for in the setup of the file or the project? any suggestions are appreciated.
Wally
At first, please double click your project and check if there is the code in your projectname.csproj file or not. It seems when you delete the splash.svg file and add a new one in the resources, the code will be auto deleted.
<MauiSplashScreen Include="Resources\Splash\splash.svg" Color="#512BD4" />
And then, I have tried to convert a png to svg, but the picture can't show perfectly as the splash. So I download a svg from the svg picture website and it can work well.
It seems maui can't make all the svg show as the splash screen perfectly. You can also download one instead of converting the png.

Flutter - SVG file's stroke becomes more thin

I have an SVG type file. I want to show it in my Flutter app using flutter_svg package. But when I imported it, the color turns into black.
According to this answer, I 'm using this software to clean it.
For some files, it's worked really well. But, I have an issue with this file.
When I'm trying to show it in my app, the stroke width decreased and my SVG becomes really thin.
This is what I want:
But, this is what I've got:
Does anyone have an idea how to solve this?
ATTACHMENT: This is the SVG file link
You need to create a path from the outline stroke line.
this is your svg: https://gist.github.com/kherel/02f288ecd73f0c29a04b1f2d9c5db3e3
I've used figma

How do I apply colors to a multi color svg in flutter?

I am looking for changing colors of an illustration svg in flutter. I tried flutter_svg package but it support applying only one color to the svg and if I do that svg will be displayed as a single color svg, individual colors are lost. Is there any way to change colors at runtime in flutter for a multi color svg?
Do you mean something like this? I call it SVG colorization.
I'll try to squeeze the concept into a short summary. In an SVG file, you need to play around with the fill property as it defines the hex color code.
In terms of programming, you would:
Extract the SVG file data as a String variable svgCode.
Assign the previous hex color code in previousColor & the currently selected hex color code in newColor.
Apply the String.replaceAll method on svgCode to replace the colors.
Update the value of the previousColor.
A more brief elaboration would be
/// Initially without any color selection.
SVGPicture.string('''<svg code with fill #f7ebcb>''');
/// After the user selects the red color.
SVGPicture.string('''<svg code with fill #FF0000>''');
This tutorial can help to solve your issue. Not only does this app changes the color on runtime, but it also allows the user to download the manipulated SVG code.

Is it possible to change the color of dash-lines in jstree

Im using jstree with a dark background, so I wonder how can I change the color of dash-lines(not sure if I call it correctly) between each node. Is it possible with CSS?
As I checked, it seems the dash-lines coming from 32px.png file.
BR
Nima
You will have to edit the 32px.png file to change the dotted line color. I did this for my dark-background web page and it looks much better. I edited the png file with Photoshop Elements and used the "Enhance| Adjust Color| Replace Color" menu to change the black color to a lighter grey by moving the Lightness slider. I also changed the interior color of the selected arrows. Once done editing, save a copy of the original and then replace the file in your CSS themes folder where style.css is.
I can't attach my copy of 32px.png, but here's how to make the change in Photoshop Elements. Other photo editors likely have the same functionality.
Replace Color in Photoshop Elements – Instructions
You can use Bootstrap themed JSTree.
Check out link: enter link description here
with CSS is not posible.