Hi Team,
In my Windows application (C#), I am using an UltraTilePanel and adding six tiles—three in the first row and three in the second row. I have a requirement where, if a specific tile is removed from the UltraTilePanel, the remaining tiles should automatically resize and fill the available space in that row.
For example, if the second tile in the first row is removed, the first and third tiles should resize and occupy the full row width. However, this behavior is not occurring. The tiles only resize correctly when each row contains an equal number of tiles.
Please suggest how to achieve the required resizing behavior when tiles are removed.
Regards,Satish Kumar Goli
Hi Satish Kumar,
Thank you for contacting Infragistics Developer Support!
While this is not something that comes out of the box, it can easily be achieved with the Tile panel API.
The approach involves handling the TileClosing event of the tile panel and adjusting all subsequent tiles positions to the previous one. For this, the panel's MaximumColumns property should be set to a specific number, i.e. 3 in tour case. If your layout requires more of a dynamic number of columns, please, let me know as this maximum current number could also possibly be calculated dynamically. In addition, please, note that these calculations are performed over the tiles positions in Normal mode only. In case the panel has any Large tiles, the adjustment is not performed.
public Form1() { InitializeComponent(); this.ultraTilePanel1.TileClosing += UltraTilePanel1_TileClosing; } private void UltraTilePanel1_TileClosing(object sender, TileClosingEventArgs e) { Point closedTilePosition = e.Tile.PositionInNormalMode; foreach (UltraTile tile in ultraTilePanel1.Tiles) { if (ultraTilePanel1.LargeTiles.Count() > 0) { break; } if (tile == e.Tile) continue; Point currentPosition = tile.PositionInNormalMode; if (currentPosition.Y == closedTilePosition.Y && currentPosition.X > closedTilePosition.X) { tile.PositionInNormalMode = new Point(currentPosition.X - 1, currentPosition.Y); } else if (currentPosition.Y > closedTilePosition.Y) { // Maxium columns set to 3 in this example, adjust as needed. Position is zero-based. int maxColumnIndex = ultraTilePanel1.MaximumColumns - 1; if (currentPosition.X == 0) { tile.PositionInNormalMode = new Point(maxColumnIndex, currentPosition.Y - 1); } else { tile.PositionInNormalMode = new Point(currentPosition.X - 1, currentPosition.Y); } } } }
I am attaching a sample app demonstrating this. Please, test it on your side and let me know if it helps. Feel free to further modify and enhance this solution to best fit your application scenarios. As a custom workaround approach, please, make sure to fully test it against any unanticipated scenarios.
Best regards, Bozhidara Pachilova Software Developer
7318.UltraTilePanel.zip
Hi Bozhidara Pachilova,
Thank you for the quick reply. Unfortunately, the provided logic does not meet the requirement.
When a tile is removed from the first row, the remaining two tiles should remain in the first row and resize to share the row equally. The tiles in the second row must keep their original positions and sizes. In the sample you sent, removing a tile from the first row causes the first tile from the second row to move up into the first row and leaves an empty space in the second row — that is not the required behavior.
Please update the logic so that only the first row is reflowed (to evenly size the remaining tiles) while the second row remains unchanged.Best Regards
Satish Kumar
Hi, thank you for clarifying. I will look into it and whether a similar workaround is possible for this requirement and will update you.