Using Photino.io allows us to create cross platform desktop applications using HTML, javascript, and CSS with C# as your backend.
This little project shows how to embed the html, script, css, and other asset files so you can produce a single exe. This way your assets won't be easily accessible inside the application directory and users can’t edit them.
https://github.com/Nicks182/PhotinoStaticFileServer
https://github.com/tryphotino/photino.Samples
Start by creating a new simple Console Application. I’m using DotNet 8.0, but you can use 7.0 if you prefer. I also ticked the “Do not use top-level statements” under Additional Information, but you don’t have to.
Start by creating an Assets folder and add your own files or use the ones in this repository.
You can manually embed any file by right clicking the file and editing its properties. I normally add a wild card to my project file. Here’s how.
Right click the project file and go to Edit Project File:
Add the highlighted part like in the image below. You can name your folder something other than Assets. Now anything you place in that directory will be Embedded into the exe automatically and you don’t have to do it with each file you wish to add.
Also set the OutputType to WinExe so we don’t get a console window.
Pay attention to the ‘FileDomain’ variable.
“PhotinoEmbeddedFiles” is the namespace of the application.
“Assets” is the folder containing the files.
You can structure this Assets folder how you like, just remember to ensure that everything you want to be Embedded is marked as such. Update the project file as needed.
Now we need to register a Custom Scheme Handler for our script file and our style file. In short, our HTML file can’t read our embedded files directly. We need a handler to find the right resource and return it to our page.
We also need to read our index.html file and pass it as a string to our photino window.
Full Program class:
Lastly, we need to add our style and script file to our html page like below. Note the : is important for our handlers to work.
The app should run now if you hit F5 in Visual Studio. When the window first opens it will show an alert. Close the alert and click the button to send a message to the C# code. The C# code will just send the message straight back and you will see another alert.
Right click the project and select Publish.
A new window will open up. Select Folder, click Next, select Folder again, click Next again. Now click the Browse button and choose where you would like to publish the files. Click Finish, then Close. You should see the below image…
Now click Show all settings and copy the image below.
Deployment mode = Self-contained. This means you won’t need to install .net on the system you want to run the app on as it will contain all it needs to do so on it’s own.
Target Runtime = win-x64. This needs to match the OS you wish to run the app on. I’m on Windows 10 x64 so I need to select win-x64.
Produce single file = true. So we create a single exe file.
Trim unused code is optional.
Click save and then click the big Publish button at the top of the screen. Once done you should see the following 4 files in your publish folder.
Yes… it’s not really a single file. Depending on the dll, it can’t always be put into a single file. In this case I believe it’s because they are C++. The .pdb file is not needed to run the app though.
Double click the exe to run the app.
I often end up having a lot of small individual script and style files which I end up bundling together.
To bundle your files you can use something like: BundlerMinifier
I’m currently using a more up to date version: BundlerMinifierPlus