Minimized panel orientation / TileViewPanel template

[Victor]

Hi,

I am trying to set the orientation of the minimized items in the bottom panel, so instead of being horizontally oriented I want them to be vertically oriented.

(see attached PNG file)

 

I though that the best approach would be to edit a copy of the TileViewPanel template/style and change it but I am unable to create a copy of it neither using Blend nor Visual Studio. 

 

So, is there any easy way to set the orientation of the minimized panel? If not, could you please provide me with a copy of the TileViewPanel template?

 

Thanks in advance.

[Martin Ivanov]

Hello Victor,

The panel that holds the minimized items behaves a bit as a wrap panel. It arranges its children from left to right, breaking the content to the next when reaching its right edge. The panel allows you to define number of rows or columns which should be satisfied when arranging the minimized items.

In your case you can use the MinimizedRowsCount property. You can set it to the number of minimized items. For example:

this.tileView.MinimizedRowsCount = this.tileView.Items.Count - 1;   ((INotifyCollectionChanged)this.tileView.Items).CollectionChanged += MainWindow_CollectionChanged;

private void MainWindow_CollectionChanged(object sender, NotifyCollectionChangedEventArgs e)
{
    var collection = (ICollection)sender;
    this.tileView.MinimizedRowsCount = collection.Count - 1;
}

Regards,
Martin Ivanov
Progress Telerik

[Victor]

Hi Martin, 

First of all, thanks for your response.

When was this property added to the RadTileView control? It doesn't seems to exist in the version  of the dll's we are using.

Is there any other way of doing this? 

I am able to access a property called MinimizedColumnWidthProperty and I can set it to the width of the TileView, but the panel doesn't wrap the content. Is there any way I can access the "minimized wrap panel" and set its properties/behaviour?

Thanks once again.

[Martin Ivanov]

Hello Victor,

The minimized row/column count properties are available since R1 2017. 

To achieve the desired behavior in a previous version you will need to create a custom panel that derives from TileViewPanel and set it to the ItemsPanel panel property of the control. However, using this approach you should write the panel's logic almost from scratch. This is why I would recommend you to update to the latest version of UI for WPF and try the built-in feature.

Regards,
Martin Ivanov
Progress Telerik

[Victor]

OK,

Thanks a lot for your help, Martin.

Regards

[Koushik]

Thanks Martin for the help. I have a related question for the controls that Victor has developed. We are facing difficulties in automating the controls derived from RadTileView & RadTileViewItem using CUIT (Code UI). The solution that I thought of is coming up with AutomationPeers inheriting from RadTileViewAutomationPeer & RadTileViewItemAutomationPeer. I am only overriding GetChildrenCore method. For RadTileViewItem, I am seeing the constructor has a signature: public RadTileViewItemAutomationPeer(object owner, ItemsControlAutomationPeer peer). I am not sure what needs to be passed as ItemsControlAutomationPeer when newing up the custom automation peer inheriting from RadTileViewItemAutomationPeer. Could you please help? An example would be great.

[Martin Ivanov]

Hello Koushik,

The constructor expects an Item of type ItemsControlAutomationPeer. This is the automation peer of the parent items control. For example, when you call the RadTileViewItemAutomationPeer constructor, the second argument should be an instance of type RadTileViewAutomationPeer. For example:

var itemPeer = new RadTileViewItemAutomationPeer(tileViewItem, tileViewAutomationPeerInstace);

Regards,
Martin Ivanov
Progress Telerik

[Koushik]

Thanks again Martin for getting back. I am doing the same already – however I don’t know how to pass the instance of the parent items control automation peer correctly. Our control hierarchy is like this –
MyTileView: RadTileView
MyTileViewItem: RadTileViewItem
MyTileView’s ItemSource is an observable collection (Windows property) of MyTileViewItem. I am getting “Recursive call to Automation Peer API is not valid” – which is logical since from MyTileViewAutomationPeer’s GetChildrenCore we are trying to create peers for each of the MyTileViewItem and subsequently from OnCreateAutomationPeer of MyTileViewItem I am passing a new Instance of parent’s MyTileViewAutomationPeer. Please refer to the attached files to see how I am passing the ItemsControlAutomationPeer.
I am doing something incorrect. Please let me know where I am doing the mistake.

Attached are the snapshots of peer implementation.

[Martin Ivanov]

Hello Victor,

Thank you for the provided information.

It seems that the error appears because the tileview item peer is created two times - in the GetChildrenCore of the tileview peer and in the OnCreateAutomationPeer() of the tileview item. Instead I could suggest you remove both overrides and create the peer in the CreateItemAutomationPeer() override of RadTileViewAutomationPeer. Here is an example in code:

public class MyTileViewAutomationPeer : RadTileViewAutomationPeer
{
    public MyTileViewAutomationPeer(RadTileView owner) : base(owner)
    {
    }

    protected override ItemAutomationPeer CreateItemAutomationPeer(object item)
    {
        return new MyTileViewItemAutomationPeer(item, this);
    }
}

public class MyTileViewItemAutomationPeer : RadTileViewItemAutomationPeer
{
    public MyTileViewItemAutomationPeer(object owner, ItemsControlAutomationPeer peer) : base(owner, peer)
    {
    }

    protected override List<AutomationPeer> GetChildrenCore()
    {
        var childrenAutomationPeer = new List<AutomationPeer>();
        var owner = Item as MyTileViewItem;
        if (owner != null)
        {
            foreach (Button button in owner.Toolbar)
            {
                var peer = UIElementAutomationPeer.CreatePeerForElement(button);
                if (peer != null)
                {
                    childrenAutomationPeer.Add(peer);
                }
            }
        }
        return childrenAutomationPeer;
    }
}

Regards,
Martin Ivanov
Progress Telerik