Designing & implementing a new skin...

Discussion in 'Skins and Design' started by JJDoherty, September 26, 2018.

Tags:
  1. JJDoherty
    • Premium Supporter

    JJDoherty MP Donator

    Joined:
    July 10, 2013
    Messages:
    138
    Likes Received:
    20
    Gender:
    Male
    Occupation:
    Software Engineer
    Location:
    Dublin
    Ratings:
    +50 / 2
    Home Country:
    Ireland Ireland
    Show System Specs
    Hi all,



    I've done a search on this in the forum and I've been able to find bits and pieces here and in the Wiki, here and what I was wondering is, is there a single resource, post or location that I should concentrate on to get started with MP2 skin design and implementation? I don't want to be wasting my time or using out-of-date information before getting started.

    I suspect that the best course of action will be to take an existing skin and alter that to get started but I would like to understand more, such as what the architecture is or why the default skin is where it is (the explanation I have read on that isn't very clear to me).

    I know this is a very non-concrete type of question but I suppose I am lacking some of the very basics of how I might approach this from scratch and indeed how to compile any new skin I might develop.

    Any help or anyone's two cents worth is more than welcome.
     
    • Like Like x 4
  2. Google AdSense Guest Advertisement



    to hide all adverts.
  3. ge2301
    • Team MediaPortal

    ge2301 MP2 Design

    Joined:
    January 11, 2014
    Messages:
    6,112
    Likes Received:
    1,536
    Gender:
    Male
    Occupation:
    Automotive Industry
    Location:
    Stuttgart (But living abroad)
    Ratings:
    +2,312 / 2
    Home Country:
    Germany Germany
    Hi and welcome,

    I can help you with the design as I'm the designer of existing MP2 skins. But I have to tell you, that I also started at 0 and learned everything with learning by doing method. That said, there is no real documentation, it would simply take too much time to create that.
    MP2 designs are based on xaml language, not xml as for MP1. There is only a small thing, MP2 uses basically MPF (MediaPresentation Foundation), which is 95% same as WPF (WindowsPresentationFoundation). If you google for xaml or WPF (it's same meaning), you have basically a large online library with all the code you need.
    As you said the best thing is to use an existing skin, that is at least partly comparable to your target design, as base. I also would recommend to first trying to create a theme of an existing skin.

    As tool you can theoretically use notepad, but I strongly recommend usage of Visual Studio. There is a free version, that fully covers all needs.
    Overall, I appreciate any people how are willing to support MP2 (y) But to not hide the hard facts, you'll definitely need some time and some enthusiasm to get a bit into xaml. The beginning is hard and I want only to support, if you are really sure that you are not somebody who gives up quickly ;) And I'll be in vacation and business trip for a month from Friday, I won't be available at all in this time frame.
    If you are still interested just let me know :D
     
    • Like Like x 1
  4. CyberSimian
    • Team MediaPortal

    CyberSimian Test Group

    Joined:
    June 10, 2013
    Messages:
    1,637
    Likes Received:
    541
    Gender:
    Male
    Location:
    Southampton
    Ratings:
    +961 / 3
    Home Country:
    United Kingdom United Kingdom
    Show System Specs
    I agree with @ge2301. I use MP1, but I was dissatisfied with the existing MP1 skins (there was one feature that I wanted that none of the existing skins offered), so I copied the files for a skin that I liked (the old "DefaultWide"), and started modifying that. I don't know anything about MP2 skins, but the MP1 skin language is full of restrictions and inconsistencies, so you can never be quite sure whether some mark-up will work until you try it. This makes the development of a new skin very time consuming.

    One really useful aspect of MP1 skins is that you can modify most skin files while MP1 is running (including for the panel on display). Simply exit the panel and then re-enter it; MP1 notices that the file has changed and reloads it. This makes experimentation very quick. Let's hope MP2 behaves the same!

    I started work on my new skin in January 2017, and I am less than halfway through (I have done most of the parts that I actually use, but none of the parts that I don't use). Of course, work on the skin has been intermittent.

    -- from CyberSimian in the UK
     
  5. ge2301
    • Team MediaPortal

    ge2301 MP2 Design

    Joined:
    January 11, 2014
    Messages:
    6,112
    Likes Received:
    1,536
    Gender:
    Male
    Occupation:
    Automotive Industry
    Location:
    Stuttgart (But living abroad)
    Ratings:
    +2,312 / 2
    Home Country:
    Germany Germany
    MPF is very consistant and has lot of potential. But it's more a real code language and consists a lot of styles, templates etc. I do not know xml well, but I think you mostly place what you want directly (with all the conconsitances mentioned). In MPF you place e.g. just a list, which has a style (defined in another style file). This list style contains another container style for the entries, the container style contains a button style, which defines the action and design on click, focus etc. As a result you can minimize reduntant code and quickly adjust the complete skin, because everything is linked. But on the other hand, as mentioned, people struggle at first to deal with all the references, because they do not know the systematic behind. I also struggeled, but not everything makes sense and step by step I can also use the potential.

    It does partly. Styles can be partly changed "online", but base entries not. Compiling is necessary after every change. It's not a big deal, in MP2 things are not placed with coordinates as I saw very often. Positioning things by try and error (moving) is not the right way. In MP2 most elements are adjusted according to a base structure by clear alignment. Also compiling is done mostly in a few seconds.
     
    • Like Like x 1
  6. Scheibes

    Scheibes Portal Pro

    Joined:
    June 14, 2012
    Messages:
    667
    Likes Received:
    22
    Gender:
    Male
    Ratings:
    +37 / 0
    Home Country:
    Germany Germany
    Show System Specs
    I am so happy that we may have a new designer at MP2. Because I think that more skins attract more people.
    And if more people use MP2, maybe more programmers will come up with MP2.

    Would be nice if the MP2 community would grow! (y)
     
    • Like Like x 1
  7. JJDoherty
    • Premium Supporter

    JJDoherty MP Donator

    Joined:
    July 10, 2013
    Messages:
    138
    Likes Received:
    20
    Gender:
    Male
    Occupation:
    Software Engineer
    Location:
    Dublin
    Ratings:
    +50 / 2
    Home Country:
    Ireland Ireland
    Show System Specs
    Great to get so many positive and useful responses. I am a programmer by profession so I am hoping (presuming) that getting up the hill regarding learning WPF (MPF in this case) will not be beyond me.

    Yes, @ge2301 "learning by doing" is definitely the way to go when learning a new programming skill. I do think that any documentation, once it is up-to-date, regardless of quality is better than none, as a starting position anyway. having used tutorials before, not unlike the (unfortunately incomplete) "Hello World" skin tutorial that can be found in the Wiki, can be a very useful starting point too.

    Anyway, thanks all for the input so far...
     
    Last edited: September 27, 2018
  8. ge2301
    • Team MediaPortal

    ge2301 MP2 Design

    Joined:
    January 11, 2014
    Messages:
    6,112
    Likes Received:
    1,536
    Gender:
    Male
    Occupation:
    Automotive Industry
    Location:
    Stuttgart (But living abroad)
    Ratings:
    +2,312 / 2
    Home Country:
    Germany Germany
    I was already worrying I was too nagative. But I prefer to show also the dark side, so nobody is dreaming of undoable things ;)

    That's great. In this case you won't have too much trouble I think. WPF is not too complicated compared to #C and for skins it's mostly copy-paste or small modification of existing code peaces. You need mostly to know where to search.

    I won't write a documentation, because I'm the only MP2 designer, who needs to maintain all skins and I'm working also on a new skin.
    Professional and private life keep me also busy. I'm actually already spending too much time with MP2, because I write also Wiki parts etc.
    You can contact me privately regarding your skin project. Discussing it in public is not good, because everybody will know better than you and before you even started you have a list of things others want to have. This is your vision and your skin.

    What I need to know in the beginning is following:
    • Do you plan to have a different main menu structure? (this is handled by a model in #C and most dofficult to change, because you need a developer)
    • Do you already have mock-ups of your design?
    • Do you have a structure of which screens and elements you want to have? Is it just rearrangement of existing elements you find in existing skins or new?
    • Which is the existing skin, that fit's closest to what you want to achieve?
    After that I can tell you where to start with small "exercises" and explain step by step the base structure of MP2.
     
    • Like Like x 1
  9. HTPCSourcer
    • Team MediaPortal
    • Administrator

    HTPCSourcer MP2 Product Manager

    Joined:
    May 16, 2008
    Messages:
    10,584
    Likes Received:
    1,110
    Gender:
    Male
    Ratings:
    +2,384 / 21
    Home Country:
    Germany Germany
    Show System Specs
    What do we need to do to also have you get an interest in developing code? :sneaky:
     
  10. JJDoherty
    • Premium Supporter

    JJDoherty MP Donator

    Joined:
    July 10, 2013
    Messages:
    138
    Likes Received:
    20
    Gender:
    Male
    Occupation:
    Software Engineer
    Location:
    Dublin
    Ratings:
    +50 / 2
    Home Country:
    Ireland Ireland
    Show System Specs
    One step at a time, me thinks! :)
     
Loading...

Users Viewing Thread (Users: 0, Guests: 0)

  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice
  • About The Project

    The vision of the MediaPortal project is to create a free open source media centre application, which supports all advanced media centre functions, and is accessible to all Windows users.

    In reaching this goal we are working every day to make sure our software is one of the best.

             

  • Support MediaPortal!

    The team works very hard to make sure the community is running the best HTPC-software. We give away MediaPortal for free but hosting and software is not for us.

    Care to support our work with a few bucks? We'd really appreciate it!