OpenSkin Designer (OSD)

There are 232 replies in this Thread which was already clicked 67,984 times. The last Post () by Lululla.


    4.2.0.0 - Gradient backgroundColor and cornerRadius mask support


    Added

    • Added support for Enigma2-style backgroundColor gradients on eLabel.
    • Added support for 3-part gradient syntax:
      • backgroundColor="#00101010,#00303030,vertical"
      • backgroundColor="red,green,vertical"
      • backgroundColor="#00ff0000,#0000ff00,vertical"
    • Added support for preserving extended cornerRadius syntax:
      • cornerRadius="30;topLeft,topRight"
      • cornerRadius="30;bottomLeft,bottomRight"
      • cornerRadius="30;left"
      • cornerRadius="30;right"


    Changed

    • Improved color parsing so comma-separated gradient values are no longer treated as invalid single colors.
    • Updated eLabel background handling so backgroundColor can be used for both normal colors and gradients.
    • Updated cornerRadius handling to save the original raw value instead of reducing it to a plain numeric radius.
    • Improved preview rendering so corner-radius edge masks are respected visually.


    Fixed

    • Fixed saving of backgroundColor="#00101010,#00303030,vertical".
    • Fixed saving of backgroundColor="red,green,vertical".
    • Fixed saving of backgroundColor="#00ff0000,#0000ff00,vertical".
    • Fixed saving of cornerRadius="30;topLeft,topRight".
    • Fixed preview issue where cornerRadius="30;topLeft,topRight" was displayed as rounded on all four corners.


    Notes

    OSD_v4.2.0.0.zip

    • Existing normal color values such as backgroundColor="#00ffffff" and backgroundColor="red" continue to work.
    • Existing simple radius values such as cornerRadius="30" continue to round all corners.



    thanks for Lululla

    Thank you to several developers for the continued updates and for your selfless sharing!

    Below is the Simplified Chinese translation file:

    简体中文.zip

    Quote from kitte888

    Curve radius was already included, now with top bot etc.


    but background gradient wasn't there at the beginning.


    I think you also didn't use the latest version.

    The latest ATV skin updates , the gradient attributes working by backgroundColor not backgroundGradient, , so the latest OSD 4.1.0.0 is depending on backgroundGradient to make the app renderer preview the gradient color, and if used backgroundColor , it preview Fuschia color as it read the attribute as one value , so it is better to update the OSD to deal with the new updates and deal with the attribute as more than one value if there are more than one value seperated by "," .


    As regard Curve radius , it is included in 4.1.0.0 but it deals with radius as one value , the new ATV skin updates deals with the radius as more than one value separated by ";" .

    • Official Post

    We'll find a shared solution, I'm sure of it. :)

    The fault always lies with whoever updates skin.py :)

    I did it back then because it started with gradients, but it didn't work in all areas yet – sometimes sliders, sometimes scrollbars – so I gave up. I've also already added input fields. Take a look and see if you can use anything.


    MOD v4.2.1.0 highlights

    This MOD focuses on compatibility with newer Enigma2 skin syntax while keeping the original OpenSkin Designer workflow.

    Added/updated support includes:

    • eLabel backgroundColor gradients using 3-part syntax: startColor,endColor,direction
    • HEX gradient values such as backgroundColor="#00101010,#00303030,vertical"
    • Named-color gradients such as backgroundColor="red,green,vertical"
    • cornerRadius masks such as cornerRadius="30;topLeft,topRight"
    • Correct saving of raw gradient and corner-radius mask values without reducing them to simple colors/numbers
    • Preview rendering that respects partial rounded corners, for example top-left and top-right only
    • Property-grid editors for gradient colors/direction instead of editing only raw strings
    • Progress and slider preview/editing for background color, foreground color, and foreground gradients
    • Listbox preview/editing for grid orientation, item gradients, selected item gradients, item radius, scrollbar radius, and scrollbar colors
    • Official Post

    I compared the 2 readme.. and there are some things that can be updated in both projects to unify them if you want


    Features (from the README)

    Quote from odem2014


    MOD v4.2.1.0 highlights

    This MOD focuses on compatibility with newer Enigma2 skin syntax while keeping the original OpenSkin Designer workflow.

    Added/updated support includes:

    • eLabel backgroundColor gradients using 3-part syntax: startColor,endColor,direction
    • HEX gradient values such as backgroundColor="#00101010,#00303030,vertical"
    • Named-color gradients such as backgroundColor="red,green,vertical"
    • cornerRadius masks such as cornerRadius="30;topLeft,topRight"
    • Correct saving of raw gradient and corner-radius mask values without reducing them to simple colors/numbers
    • Preview rendering that respects partial rounded corners, for example top-left and top-right only
    • Property-grid editors for gradient colors/direction instead of editing only raw strings
    • Progress and slider preview/editing for background color, foreground color, and foreground gradients
    • Listbox preview/editing for grid orientation, item gradients, selected item gradients, item radius, scrollbar radius, and scrollbar colors

    As usual, excellent work Mohammed is added to your creative updates and I hope that more features will be added that facilitate the work of designers.


    It will be nice if you can add


    1. self debugging option to revise the xml prior save it or add something like multiple auto save point to restore the work incase of shit happen.


    2. Add option to multiple select dragging /moving for group of items within same screen, instead of adjust it one by one.


    3. Add option to multiple copy paste for set of items by select it from one screen to another instead of move it by code.


    4. Add option to real time detect for x&y position for item, by holding specific item and move it by mouse.


    5. Add ruler 📏 vertical and horizontal to the main program screen.


    6. Add auto organizer or filter to screen components like filter the elable only to be visible or filter the widget only...etc this will help to focus on some component in complex screens.


    7. Add option to select screen and move it up/down from the right tree within the xml file.


    I know that some proposals seem complicated or require deep modifications in the structure of the system, but they are suggestions that came to my mind and I wanted to share with you with the intention of encouragement.


    my greetings

    • Official Post
    Quote from Lululla

    I compared the 2 readme.. and there are some things that can be updated in both projects to unify them if you want


    Features (from the README)


    In the meantime that oldem2014 finishes all the new features, let's see how this test behaves?



    removed all old error on root structure.


    Release v4.2.1.0 MOD by Lululla · OwnerPlugins/OpenSkin-Designer


    and added

    Release v4.2.2.0 MOD by Lululla · OwnerPlugins/OpenSkin-Designer


    preview4.jpg?raw=true

    • Official Post

    New test today v.4.2.3.0


    FeatureStatusLocation
    selectionZoom for listbox✅ DonesGraphicListbox.cs – selected item zoom
    New eSlider widget✅ DonesAttributeSlider.cs + sGraphicSlider.cs + integration in sAttributeWidget and sGraphicWidget
    scrollbarBackgroundGradient✅ DonesAttributeListbox.cs (property) + rendering in sGraphicListbox
    Gradients for any widget✅ DoneBase sAttribute with BackgroundGradient, ForegroundGradient, helper
    Extended ClockToText✅ Donestrftime.ToString + ClockToText.getText with %l, %I, %e, %p, %P, lowerAmpm
    Extended ServiceName✅ DoneAdded ChannelNumber, ChannelNumberAndName, PiconName, ReferenceName



    Example:


    On github

    "- Added 2560x1440 and 3840x2160 options in fResolution (selection available, automatic scaling not implemented)"


    "- **Known Limitations"

    "- Resolution changes in `fResolution` correctly update the `output` attribute in the `skin.xml` file,"

    "- but they do not automatically resize coordinates, dimensions, and fonts of the elements."

    "- To convert an existing skin from one resolution to another, it is recommended to use the external tool **Enigma2 Skin Converter** (by @KiddaC)."

    • Official Post

    Next version too..
    pasted-from-clipboard.png



    MoveUp - MoveDown - SortScreen

    Tested..


    if want try..



    Ps.. in next version


    • Add ruler 📏 vertical and horizontal to the main program screen.

    my mod v4.2.2.0 for testing:

    1 - new feature , you can edit included xml in code panel .

    osd3.jpg

    2- new feature , you can hold Ctrl key and select multiple items and move it as one unit preserving the position to each other . after moving , press on any other item to stop Ctrl effect , note that no REDO available for such move .

    osd2.jpg


    3- new feature , enable UP and Down MOVE for a screen or an item inside the screens , in the main xml or in the included xml , also you can cut , copy and paste any item , note that paste will occur below the highlighted item .

    osd1.jpg


    4- fix crash when switching between preview mode 'random , all ,default , none' .


    ** we may merge all new features in one mod after testing it from the users and approve that it works well .

Your resource for Enigma2 skins and GUI customization

Download custom themes, get installation support, and find tools to modify your receiver's display. Customize your Enigma2 GUI. Discover and download custom skins, with dedicated support for installation and visual personalization.