Announcement

Collapse
No announcement yet.

correct way to add icon to menu bar

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • foxesden
    replied
    Thanks, I will give that a try.​

    [Edit] Again for completeness of documentation
    I opened the SVG file in notepad++ and replaced entries

    <path style="opacity:1" fill="#fefefe"
    with
    <path style="opacity:1" fill="#000"

    and this worked as you described, I wasted a bit of time trying to use an online SVG editor to do this only to realise that the colour #000 is just a place-holder.
    Last edited by foxesden; 2023-02-03, 11:17. Reason: Edit to include more detailed notes

    Leave a comment:


  • cpd73
    replied
    Originally posted by foxesden View Post
    SqueezeDSP.svg - my original image with colours inverted and saved as svg file.

    NB I had to invert the colours because I had black on a transparent background which doesn't work so well with Material Dark schema. I may need to play around to get something that is more portable. But in principal it is all working
    For Material your icon should be monochrome and only use #000 for fills and strokes, etc. Material will then recolour the icon to match the user's theme. The Material Perl code does a simple search and replace on the #000 string.

    Leave a comment:


  • foxesden
    replied
    Thanks - will give it a go.

    Edit
    It is working thanks very much .For the record this is what I have

    perl command in plugin
    Slim::Web::Pages->addPageLinks("icons", { $class->getDisplayName => '/plugins/SqueezeDSP/images/SqueezeDSP_svg.png' });
    Then in my plugin images folder
    C:\ProgramData\Squeezebox\Cache\InstalledPlugins\P lugins\SqueezeDSP\HTML\EN\plugins\SqueezeDSP\image s

    I have 2 images
    SqueezeDSP_svg.png - this is my original image and has been named so it complies with the above command
    SqueezeDSP.svg - my original image with colours inverted and saved as svg file.

    NB I had to invert the colours because I had black on a transparent background which doesn't work so well with Material Dark schema. I may need to play around to get something that is more portable. But in principal it is all working


    Last edited by foxesden; 2023-02-02, 16:31.

    Leave a comment:


  • cpd73
    replied
    If an item is under the 'Extras' it should just show for Material. Material does exclude some items (Alarm, CustomBrowse, DSTM, TrackStat, DynamicPlaylist), but others should be shown fine here. But you do need to enable the showing of 'Extras' in Material's 'Settings -> Interface' dialog - the 'Extras' category is hidden by default.

    Yout icon namaing is also incorrect.

    - Blah_MTL_icon_yyy.png Will cause Material to look for an icon-name of 'yyy' in the Google Material icon font.
    - Blah_MTL_svg_yyy.png Will cause Material to look for an SVG named 'yyy.svg' within Material's icon folder
    - Blah_svg.png Will cause Material to look for Blah.svg within your plugin's folder

    Hope the above helps.

    Leave a comment:


  • foxesden
    started a topic correct way to add icon to menu bar

    correct way to add icon to menu bar

    I am trying to get my plugin's icon to display correctly on Material Skin. I can get it working on the "normal" web UI. Here are some code extracts. That I have tried having read various posts. The first one works on the normal UI.

    Slim::Web::Pages->addPageLinks("icons", { $class->getDisplayName => '/plugins/SqueezeDSP/images/SqueezeDSP_300x300_f.png' });

    #Slim::Web::Pages->addPageFunction("/plugins/SqueezeDSP/HTML/images/SqueezeDSP_300x300_f.png", \&handleWebStatic);
    Slim::Plugin::OnlineLibrary::Plugin->addLibraryIconProvider('SqueezeDSP', '/plugins/SqueezeDSP/images/SqueezeDSP_MTL_icon_.png');
    #Slim::Web::Pages->addPageLinks("icons", { $class->getDisplayName => '/Plugins/SqueezeDSP/SqueezeDSP.png' });​

    Any suggestions on how to get the icon displayed correctly in the extras space on both normal and material web interfaces?
Working...
X