MediaPortal Windows Media Center

Site navigation


Last Edit

Page last modified 19:11, 6 Jan 2012 by Dadeo
MediaPortal Wiki > MediaPortal 1 > Contribute > Skins > Skin Related Changes > 1.1.0 to 1.2.0 > CoverFlow Control Created

CoverFlow Control Created

Was this page helpful?

    Purpose

    • Required:  No
    • Type of Change:  Feature

    A new facade layout for displaying a list of items that resembles the iphone style coverflow as shown in the following video:

    Get Adobe Flash player

    Coverflow can be selected like any other layout (list, icons, filmstrip etc.)

    Description of Change

    A new control has been added GuiCoverFlow (coverflow).  It not only provides a unique layout display, but it also enables the cover to be 'flipped' so that additonal information displays on the reverse of the cover by using F3 on the keyboard or the Show Info key on the remote (usually the yellow button on MCE Remotes)

    See also:  Using MediaPortal > Basics > Layouts > CoverFlow

    Additional Information and References

    • Mantis Issue:
    • Related xml(s):  all xmls where coverflow control is used
    • Window ID:  all windows where GUICoverFlow class is used
    • Related GUI property/control:  GUICoverFlow (coverflow)

    XML/Code Samples

    The following code example shows the coverflow control as used in the Blue3Wide skin (common.facade.video.xml)

    <control>
              <description>Cover Flow view</description>
              <type>coverflow</type>
              <colordiffuse>90ffffff</colordiffuse>
              <dimColor>90ffffff</dimColor>
              <id>50</id>
              <posX>0</posX>
              <posY>200</posY>
              <width>1280</width>
              <height>720</height>
              <onup>2</onup>
              <onleft>2</onleft>
              <selectedCard>0</selectedCard>
              <cardWidth>250</cardWidth>
              <cardHeight>360</cardHeight>
              <angle>45</angle>
              <sideShift>220</sideShift>
              <sideGap>150</sideGap>
              <sideDepth>250</sideDepth>
              <offsetY>20</offsetY>
              <selectedOffsetY>0</selectedOffsetY>
              <speed>5</speed>
              <backgroundHeight>250</backgroundHeight>
              <backgroundWidth>1280</backgroundWidth>
              <backgroundX>0</backgroundX>
              <backgroundY>470</backgroundY>
              <backgroundDiffuse>FF000000</backgroundDiffuse>
              <background>background2.png</background>
              <showBackground>yes</showBackground>
              <foregroundHeight>720</foregroundHeight>
              <foregroundWidth>1280</foregroundWidth>
              <foregroundX>0</foregroundX>
              <foregroundY>0</foregroundY>
              <foregroundDiffuse>FF000000</foregroundDiffuse>
              <foreground>coverflow_foreground.png</foreground>
              <showForeground>no</showForeground>
              <showFrame>yes</showFrame>
              <frame>Picture_cover2.png</frame>
              <frameFocus>Picture_cover2.png</frameFocus>
              <frameWidth>250</frameWidth>
              <frameHeight>360</frameHeight>
              <spinSpeed>8</spinSpeed>
              <unfocusedAlpha>FF</unfocusedAlpha>
              <folderPrefix>[</folderPrefix>
              <folderSuffix>]</folderSuffix>
              <font1>font13</font1>
              <font2>font10</font2>
              <label1>#title</label1>
              <label2>#genre</label2>
              <textColor>FFFFFFFF</textColor>
              <remoteColor>FFFF0000</remoteColor>
              <playedColor>FFA0D0FF</playedColor>
              <downloadColor>FF00FF00</downloadColor>
              <selectedColor>FFFFFFFF</selectedColor>
              <shadowAngle>45</shadowAngle>
              <shadowDistance>0</shadowDistance>
              <shadowColor>FF000000</shadowColor>
              <label1YOff>405</label1YOff>
              <label2YOff>430</label2YOff>
              <pageSize>5</pageSize>
              <scrollbarBackground>bar_hor.png</scrollbarBackground>
              <scrollbarLeft>mouse_left_horizontal.png</scrollbarLeft>
              <scrollbarRight>mouse_right_horizontal.png</scrollbarRight>
              <scrollbarYOff>455</scrollbarYOff>
              <showScrollbar>yes</showScrollbar>
              <cards flipY="yes" diffuse="Thumb_Mask.png" mask="video_poster_mask.png"></cards>
              <subitems>
                <subitem>
                  <![CDATA[
                    <controls>
                      <control>
                        <description>background</description>
                        <type>image</type>
                        <posX>0</posX>
                        <posY>0</posY>
                        <width>250</width>
                        <height>360</height>
                        <texture flipY="yes" diffuse="Thumb_Mask.png" mask="video_poster_mask.png">background2.png</texture>
                      </control>
    
                      <control>
                        <description>Movie Details</description>
                        <type>label</type>
                        <posX>20</posX>
                        <posY>10</posY>
                        <width>210</width>
                        <label>Movie Details</label>
                        <font>font10</font>
                        <textcolor>FFFFFFFF</textcolor>
                      </control>
                    </controls>
                  ]]>
                </subitem>
              </subitems>
            </control>

    Screenshots

    coverflow3.png




    Running the latest version?

    V1.7.0 - released April 2014
    Releasenews | Download
    Changelog
     | Requirements
    HTPC
    Team-MediaPortal
     
    About
    Contact |  Press
    Partners