Ticket T267956
Visible to All Users

TileView tile border width

created 10 years ago

I am using a single column TileView as a selector. The data is bound to a datasource and an unbound column supplies the logo. The grid on the right filters according to the selection.

The border surrounding the selected/focused tile is too narrow and it is hard to see which tile is focused. Is there any way I can change it from the 2 pixel width it has to 6 or 8?

Also I want to display the tile checkmark in the top right corner for the focused Tile but with a slight twist:
When a user changes the focused row, the checkmark is 'added' and this will be used to filter the grid on the right. If the user reclicks on the same focused tile, the checkmark is removed (and the filter is removed from the grid).
(I am aware that a bound data source always has to have a current row limitation)
I can control whether the focused Tile is deemed to be checked or not by using FocusedRowChanged and TileClicked handlers etc. but how can I get the target Tile to draw with the checkmark?

Comments (2)

    I found the ItemCustomize event and I can now get the checkmark to display exactly when I want it, so forget that bit.
    I am now using the latest 15.1.4 release too.
    I would still like to be able to increase the width of the border around a selected tile though.
    Also, I have found two possible bugs (feel free to move them into new tickets):-

    1. The TileView.ItemCustomize event first gets called with e.Item==null. (if this is a special case to configure something on first use, it needs documenting)
    2. The border of a focused tile get trimmed at the bottom when it is the last item. I have attached an image showing the issue. The scrollbar is down as far as it will go and the issue occurs for all skins.

      Also, the issue in (2) occurs when a tile is scrolled into view upwards - the tile shows at the bottom but isn't scrolled far enough to see the full focus border.

      Answers approved by DevExpress Support

      created 10 years ago (modified 10 years ago)

      Hello Simon,
      As for the issues with clipping a bottom tile and the e.Item argument set to null, this behavior is unexpected, an we need additional time to research it. I've created separate tickets on your behalf (TileView - The bottom tile is clipped, TileView.ItemCustomize - The e.Item argument is null on the application startup) and passed them to our developers. Please stay tuned. We'll update those threads as soon as we make any progress.
      As for increasing the border width, this task is a bit complicated and requires creating a TileView descendant. Here is the code:

      C#
      [ToolboxItem(true)] public class MyGridControl : GridControl { protected override BaseView CreateDefaultView() { return CreateView("MyTileView"); } protected override void RegisterAvailableViewsCore(InfoCollection collection) { base.RegisterAvailableViewsCore(collection); collection.Add(new MyTileViewInfoRegistrator()); } } public class MyTileView : TileView { public MyTileView() { } protected override string ViewName { get { return "MyTileView"; } } } public class MyTileViewInfoRegistrator : TileViewInfoRegistrator { public override string ViewName { get { return "MyTileView"; } } public override BaseView CreateView(GridControl grid) { return new MyTileView(); } public override BaseViewInfo CreateViewInfo(BaseView view) { return new MyTileViewInfo(view as MyTileView); } } public class MyTileViewInfo : TileViewInfo { public MyTileViewInfo(TileView view) : base(view) { } protected override TileViewInfoCore CreateViewInfoCore() { return new MyTileViewInfoCore(this, View as TileView); } } public class MyTileViewInfoCore : TileViewInfoCore { public MyTileViewInfoCore(ITileControl owner, TileView view) : base(owner, view) { } protected override int SelectionWidth { get { return 5; } } }

      Please test this approach and let me know if it helps.

        Comments (2)

          It works and looks fantastic. Thank you!

          DevExpress Support Team 10 years ago

            You are welcome ,Simon! Please feel free to contact us in case of further difficulties.

            Disclaimer: The information provided on DevExpress.com and affiliated web properties (including the DevExpress Support Center) is provided "as is" without warranty of any kind. Developer Express Inc disclaims all warranties, either express or implied, including the warranties of merchantability and fitness for a particular purpose. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.

            Confidential Information: Developer Express Inc does not wish to receive, will not act to procure, nor will it solicit, confidential or proprietary materials and information from you through the DevExpress Support Center or its web properties. Any and all materials or information divulged during chats, email communications, online discussions, Support Center tickets, or made available to Developer Express Inc in any manner will be deemed NOT to be confidential by Developer Express Inc. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.