TrayApps - Xenon257R/blue-archive-rainmeter GitHub Wiki

This skin is a generic, template skin used as application/website shortcuts.

This template uses adaptive colors and utilizes a spritesheet structure. To those looking to build on a simple, single square image icon app, refer to SimpleApps instead.

Components & Behaviors

Context Menu Options

  • Rewire App
  • Enable/Disable Shine
    • The appropriate option will appear according to the currently active option.
    • This setting is changed for all Tray Apps that inherit appbase.inc.

Mouse Actions

  • Left-Clicking the Icon: Executes Rainmeter Bangs as specified by the user in Execution.
  • Hovering over the Icon: A shimmer is animated over the icon. Disabled by default.

Details

Making Copies

The template of this skin can be found in the TrayApps\ directory by the name of App0, housing a configuration file called app.inc. You will want to copy the App0 directory in the same place, naming each new copy appropriately.

As this is primarily a template skin, it is expected and encouraged that you make as many copies of this skin as you need in the TrayApps directory and rename those directories appropriately. With each newly copied template, it is advised to follow the checklist below to make sure everything continues to work perfectly:

  • Set the Position value to On Desktop in the Rainmeter client (in Rainmeter.ini, the variable name is AlwaysOnTop with a value of -2)
  • Rename the config folder appropriately
  • Catalog the config folder in the ToggleSwitch database (layout.json)
  • If in use, reposition the skin appropriately - then disable dragging in the Rainmeter client

:speech_balloon: Make as many copies of the template for as many apps you use instead of how much you can fit on the tray and catalog them in the ToggleSwitch deactivated. This will allow you to hotswap apps in and out of the tray by simply activating and deactivating the apps directly from the ToggleSwitch database.

The Spritesheet Anatomy

The template skin will assume you are using spritesheets for your app images to properly inherit color values from your Style Settings. If you instead prefer to keep things simple and use a single image file for your apps, an unloaded Skin called AppSimple with a config file simple.ini can be found in the TrayApps directory that you can use instead. It implements the appbasesimple.inc template and is an extremely small 5-line configuration file.

Any Spritesheet of 7 square images placed side-by-side horizontally will be properly parsed by the skin - i.e., a spritesheet with 7:1 dimensions will work. The images will be stacked on top of each other from left to right and colored appropriately by their color assignments as specified by AppSettings as well as the overarching StyleSettings. The lowest level - which is presumed to be the shadow - will be slightly offset downwards in the positive Y direction.

:speech_balloon: Due to the images being stacked on top of each other for the final product, images placed on the lower level will be obstructed by the ones above; this logic is utilized in the spritesheets I have drawn, and as such is ill-advised to use transparent colors for coloring tray apps as the lower-level assets' colors will bleed into its neighboring layers. However, if the result of transparency is to your liking, you can disregard this being an issue at all.

A Shine for Your Pins

When the Shine option is enabled, apps will shimmer when it is hovered over. A mask is used to determine the correct shape to shimmer over. The skin will assume the 6th sprite in the spritesheet as the largest image asset (as it should be if the spritesheet is built upon the outlined anatomy above) and will use it as a Rainmeter Container.

Having this option enabled WILL register a brief but large uptick in CPU usage by Rainmeter every time it activates. This value will easily get compounded the more apps you have for absurd CPU usage for a few seconds. If you absolutely must have this feature active, it is advised that you have Hardware Acceleration enabled if applicable and NOT sweep across your app tray left and right with glee while you have heavy processes running at the same time.

Naming Your Apps

The TrayApp skin template is rigid in its dimensions and will not extend itself to make room for long strings. This is particularly true in the negative x/y direction, as Rainmeter cannot expand backwards due to the way its windows are drawn. To accommodate for longer strings, appbase will reduce the Font Size of the string if it becomes too long to fit ONCE, and if after the reduction the string still fails to fit will simply truncate the remainder of the string.

If you prefer the smaller font size to be applied to every App, you can pad the start and end of your string with underscores(_) evenly on both sides. Leading and trailing underscores will be colored transparent by appbase so they still occupy space and still contribute to the length of the string.

The Power of Rainmeter Bangs

Even within the constraints of the UI, the user has as much freedom as Bangs provide in determining what clicking the "app" will do. Reading the official documentation is encouraged for those who want the button to do more than just open applications or webpages. However, if the simple things suffice, the following cheat sheet will get you far enough:

Apps:              ["C:\Filepath\To\Executable\app.exe"]
Windows Shortcuts: ["C:\Filepath\To\Shortcut\shortcut.lnk"]
Webpages:          ["https:\\www.google.com"]

You can concatenate as many of these bangs as you would like one mouse-click to do. For example, the code below will open your browser to YouTube, Reddit and GMail as well as your C: Drive on the side:

["https://www.youtube.com"]["https://www.reddit.com"]["https://www.gmail.com"]["C:\"]

Just remember that all of these Bangs will fire every time you click the app, so multiple clicks can easily become destructive.