Vista Style Builder

   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: Skinning through the shellstyle - here a short explanation  (Read 11859 times)
Purecut
Beginner
*
Posts: 9


View Profile
« on: November 08, 2009, 06:43:43 pm »

It is possible to style the explorer previewpane through the shellstyle.dll. This will make you autonomous from you used fonts and color in your main theme. Also animation is possible.
Here a short description about the main labels:



And here a example for the "documentslayoutstyle"


    <style resid="documentslayoutstyle">
      <if id="atom(PreviewContainer)">
        <Element padding="rect(10rp, 8rp, 8rp, 8rp)"/>
      </if>
      <if id="atom(ReadingPane)">
        <Element padding="rect(4rp, 4rp, 4rp, 4rp)"/>
      </if>
      <if id="atom(clientviewhost)">
        <ViewHost foreground="windowtext" background="themeable(gtc(ItemsView, 0, 0, 3802), window)" sortcolumn="themeable(gtc(ItemsView, 0, 0, 3802), window)" subtext="ARGB(255, 139, 139, 139)" />
      </if>
      <MetadataElement ThemeSubApp="DocumentsPreviewPaneControl"/>
      <element id="atom(animation)" animation="position|exp|fast"/>
      <MetadataLabel foreground="themeable(ARGB(255, 255, 236, 0), windowtext)" fontstyle="shadow"/>
      <MetadataElement foreground="themeable(ARGB(255, 255, 255, 255), windowtext)" fontstyle="shadow"/>
      <if id="atom(PreviewMetadataControlEditable)">
        <MetadataDisplayElement foreground="themeable(ARGB(255, 255, 255, 255), windowtext)" fontstyle="shadow"/>
      </if>
      <if id="atom(PreviewMetadataEditControl)">
        <InPlaceEdit foreground="themeable(ARGB(255, 255, 255, 255), windowtext)" fontstyle="shadow"/>
      </if>
      <if id="atom(PreviewMetadataSubTitleControl)">
        <MetadataElement foreground="themeable(ARGB(255, 255, 255, 255), windowtext)" fontstyle="shadow"/>
      </if>
      <if id="atom(PreviewMetadataTitleControl)">
        <MetadataElement foreground="themeable(ARGB(255, 255, 255, 255), windowtext)" fontstyle="shadow"/>
      </if>
      <if id="atom(ItemCountLabel)">
        <MetadataLabel foreground="themeable(ARGB(255, 255, 255, 255), windowtext)" fontstyle="shadow"/>
      </if>
      <PreviewMetadata padding="Rect(10rp, 5rp, 10rp, 3rp)"/>
      <MetadataDisplayElement contentalign="bottomleft | endellipsis"/>
      <if id="atom(PreviewMetadataRow)">
        <Element height="18rp"/>
      </if>
      <if id="atom(PreviewMetadataControlEditable)">
        <MetadataDisplayElement cursor="ibeam"/>
        <if KeyFocused="true">
          <MetadataDisplayElement contentalign="focusrect | bottomleft | endellipsis"/>
        </if>
      </if>
      <if id="atom(PreviewMetadataEditControl)">
        <InplaceEdit contentalign="bottomleft | endellipsis"/>
      </if>
      <if id="atom(PreviewMetadataReadOnlyControl)">
        <InplaceEdit contentalign="bottomleft | endellipsis"/>
      </if>
      <if id="atom(PreviewForceLoadMetadata)">
        <Button background="themeable(dtb(PreviewPane, 2, 1), ARGB(0, 0, 0, 0))" contentalign="bottomleft" cursor="hand" font="9;Semibold;shadow;Segoe UI" foreground="gtc(FlyoutStyle, 3, 3, 3803)" height="18rp"/>
        <if MouseFocused="true">
          <Button background="themeable(dtb(PreviewPane, 2, 2), ARGB(0, 0, 0, 0))"/>
        </if>
        <if KeyFocused="true">
          <Button contentalign="focusrect | bottomleft"/>
        </if>
      </if>
      <PreviewThumbnail background="ARGB(0, 0, 0, 0)" padding="Rect(18rp, 4rp, 4rp, 4rp)"/>
      <if id="atom(PreviewMetadataTitleControl)">
        <MetadataElement font="8;Semibold;shadow;Verdana" height="18rp"/>
      </if>
      <if id="atom(PreviewMetadataSubTitleControl)">
        <MetadataElement font="8;Normal;shadow;Verdana" height="18rp"/>
      </if>
      <if id="atom(PreviewMetadataControl)">
        <MetadataElement contentalign="bottomleft | endellipsis" font="8;Normal;shadow;Verdana"/>
      </if>
      <if id="atom(ItemCountLabel)">
        <MetadataLabel contentalign="bottomleft | endellipsis" font="10;Normal;shadow;Verdana" height="24rp"/>
      </if>
      <if id="atom(PreviewMetadataSpacer)">
        <Element height="24rp"/>
      </if>
      <if id="atom(PreviewEditMetadata)">
        <Element height="24rp"/>
      </if>
      <MetadataLabel contentalign="bottomright | endellipsis" font="8;Normal;shadow;Verdana" height="24rp" padding="Rect(0rp, 0rp, 3rp, 0rp)"/>
      <Sizer background="ARGB(0, 0, 0, 0)"/>
      <if SlidesUpAndDown="true">
        <Sizer cursor="sizens" height="5rp"/>
      </if>
      <if SlidesUpAndDown="false">
        <Sizer cursor="sizewe" width="3rp"/>
      </if>
      <if id="atom(PreviewPaneSizer)">
        <Sizer background="themeable(ARGB(0, 0, 0, 0), buttonface)"/>
      </if>
      <if id="atom(PageSpaceControlSizer)">
        <Sizer background="themeable(dtb(PreviewPane, 3, 0), buttonface)" borderthickness="rect(0rp,0rp,0rp,0rp)"/>
      </if>
      <if id="atom(ReadingPaneSizer)">
        <Sizer background="themeable(dtb(PreviewPane, 4, 0), buttonface)" borderthickness="rect(0rp,0rp,0rp,0rp)"/>
      </if>
      <if id="atom(ProperTreeExpandoSizer)">
        <Sizer background="buttonface" bordercolor="buttonhighlight" borderstyle="solid" borderthickness="rect(0rp,1rp,0rp,1rp)" height="4rp"/>
      </if>
      <if id="atom(PreviewPaneSizer)">
        <Sizer FramePersistType="2" InitialSize="53" MinSize="53" ReservedSpace="170"/>
      </if>
      <if id="atom(CommonItemDialogSizer)">
        <Sizer FramePersistType="2" InitialSize="100" MinSize="100"/>
      </if>
      <if id="atom(PageSpaceControlSizer)">
        <Sizer FramePersistType="2" InitialSize="160" MinSize="60" ReservedMaster="atom(ReadingPane)" ReservedSpace="132"/>
      </if>
      <if id="atom(ProperTreeExpandoSizer)">
        <Sizer FramePersistType="2" InitialMaxxedOut="true" InitialSize="120" ReservedSpace="26"/>
      </if>
      <if id="atom(PreviewPaneSizer)">
        <Sizer DisablingPolicy="{17067f8d-981b-42c5-98f8-5bc016d4b073}" ExplorerVisibility="{43abf98b-89b8-472d-b9ce-e69b8229f019}"/>
      </if>
      <if id="atom(ReadingPaneSizer)">
        <Sizer DisablingPolicy="{33dcce8d-b6f8-4b7a-ac93-45e301f956aa}" ExplorerVisibility="{893c63d1-45c8-4d17-be19-223be71be365}"/>
      </if>
      <if id="atom(PageSpaceControlSizer)">
        <Sizer ExplorerVisibility="{cb316b22-25f7-42b8-8a09-540d23a43c2f}"/>
      </if>
      <if id="atom(ReadingPaneSizer)">
        <Sizer FramePersistType="3" GrowTargetFirst="true" InitialSize="260" InitialVisibility="false" MinSize="68" ReservedMaster="atom(PageSpaceControlSizer)" ReservedSpace="202"/>
      </if>
      <TemplateBackground background="ARGB(0, 0, 0, 0)"/>
      <if id="atom(ReadingPane)">
        <TemplateBackground background="themeable(Gradient(gtc(ReadingPane, 1, 0, 3810), gtc(ReadingPane, 1, 0, 3811), gtc(ReadingPane, 1, 0, 3812), 4), window)" font="gtf(TextStyle, 4, 0)"/>
      </if>
      <if id="atom(RPaneCoverSheet_NoSel)">
        <Element background="ARGB(0, 0, 0, 0)" foreground="themeable(gtc(ReadingPane, 2, 0, 3803), windowtext)"/>
      </if>
      <if id="atom(PreviewShineLayer)">
        <TemplateBackground background="themeable(dtb(DocumentsPreviewPaneControl::Edit, 3, 0), window)"/>
      </if>
      <if id="atom(PreviewShineLayer)" Vertical="true">
        <TemplateBackground background="themeable(dtb(PreviewPane, 1, 2), window)"/>
      </if>
    </style>
Logged
sunbeam2000
Beta Tester
Dedicated Themer
*
Posts: 207


View Profile WWW
« Reply #1 on: November 09, 2009, 10:34:46 am »

good explanation!!!

just two suggestions:

i would prefer to set the textcolor in msstyle and not by ARGB

and

set the Previewpane background in Background and not in Shinelayer, so you can lay a (transparent) Shinelayer over it..

but that's only my opinion...
Logged
Panda X
Administrator
Dedicated Helper
*****
Posts: 1645



View Profile
« Reply #2 on: November 09, 2009, 02:33:18 pm »

good explanation!!!

just two suggestions:

i would prefer to set the textcolor in msstyle and not by ARGB

and

set the Previewpane background in Background and not in Shinelayer, so you can lay a (transparent) Shinelayer over it..

but that's only my opinion...
Following the DirectUI Notes in the Other section you can do set the property in the MSStyles rather than ARGB in DUIXML.
Logged
Purecut
Beginner
*
Posts: 9


View Profile
« Reply #3 on: November 09, 2009, 08:12:52 pm »

I have never said that you have to do this so. People are complaining what all the stuff means and I have shown them to understand the sections in the shellstyle.dll what all the stuff means, so that they can better understand the format of the shellstyle.dll. Not more or less.
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.12 | SMF © 2006-2009, Simple Machines LLC Valid XHTML 1.0! Valid CSS!