locked
How to style the scrollbar of a listView in Win8 Style App? RRS feed

  • Question

  • Hi,

    How to style the scrollbar of listView control? Such as change the scrollbar's width and color.

    My listView control is like this:

    <div id ="listArea" class ="listArea">
        <div id ="listView" data-win-control ="WinJS.UI.ListView" data-win-options="{ 
           itemDataSource: Data.pictureList.dataSource, 
           selectionMode: 'multi', 
           tapBehavior: 'invoke', 
           swipeBehavior: 'select', 
           layout: { type: WinJS.UI.ListLayout } }">
        </div>
    </div>

     
    Sunday, December 23, 2012 10:11 AM

Answers

  • Hi,

    You could override the corresponding style in ui-dark.css or ui-light.css .

    You can find that in Reference->windows library for javascript 1.0->css .


    Roy
    MSDN Community Support | Feedback to us
    Develop and promote your apps in Windows Store
    Please remember to mark the replies as answers if they help and unmark them if they provide no help.

    • Marked as answer by Lattimore Monday, December 24, 2012 7:01 AM
    Monday, December 24, 2012 6:50 AM

All replies

  • what is the question you are asking

    Sunday, December 23, 2012 11:01 PM
  • Hi,

    You could override the corresponding style in ui-dark.css or ui-light.css .

    You can find that in Reference->windows library for javascript 1.0->css .


    Roy
    MSDN Community Support | Feedback to us
    Develop and promote your apps in Windows Store
    Please remember to mark the replies as answers if they help and unmark them if they provide no help.

    • Marked as answer by Lattimore Monday, December 24, 2012 7:01 AM
    Monday, December 24, 2012 6:50 AM
  • sorry to disappoint you, but that is not a correct answer...

    there are no declarations in ui-dark.css or ui-light.css regarding the scrollbar.

    also tried declaring this:

    #myListView .win-itemscontainer {
        scrollbar-arrow-color: blue;
        scrollbar-face-color: blue;
        -ms-scrollbar-arrow-color: blue;
        -ms-scrollbar-face-color: blue;
    }

    and had no effect

    Monday, December 23, 2013 1:41 AM