Is there a good way to setup the tiles control so that each tile get the same size, and the tiles fill the available space? I'd like a view to come up with 6 tiles (2x3) where each tile is the same size and as the window resizes, the tiles resize. I was able to achieve this by listening to ActualWidth/ActualHeigh change events, and settings the tile preferred size. But that falls apart as soon as I resize the tiles individually.
Seems like what I really need is a way to do percentage based tile sizes, much like the Grid. Is something like this possible?
Also, is there an event in the XamTilesControl to notify me when tiles are being manually resized by the user?
Thanks!
Hi,
The normal behavior is for the control to reposition the tiles based on the attributes provided, resizing and repositioning the tiles as necessary. I modified the settings that I gave you initially so that I set the VerticalTileAreaAlignment to Top and I changed the TileConstraints so that the Preferred Height and Width are 100, the Max Height and Width are 400 and the Min Width and Height are 50.
That caused there to be two rows of tiles that stretched across the xamTilesControl but since their height wasn’t stretched, you are able to resize a row of tiles and retain the position of the tiles in the row.
Try setting the AllowTileSizing to Individual. With the additional settings I’m suggesting, you can resize a tile and not impact the tiles in the other row. And with the AllowTileDragging set to Swap you can drag a single tile from one row to another, swapping the tiles.
This link will give you the properties that are available for modifying the behavior and layout of tiles in the normal state.
http://help.infragistics.com/NetAdvantage/WPF/2010.3/CLR4.0/?page=xamTilesControl_Modify_Tile_Behaviors_in_Normal_Mode.html
This link describes the animation behaviors. You might also want to try setting the ShouldAnimate property to false to see if that makes the visual behavior more to your liking.
http://help.infragistics.com/NetAdvantage/WPF/2010.3/CLR4.0/?page=xamTilesControl_About_Animations.html
Hi Marianne,
Thanks for the information. I had actually read that documentation several times already, but setting the alignments to stretch hadn't worked as I thought it would. Well, it must have been something else I had screwed up at the time, because I tried it again today and now it does exactly what I hoping for, resizing to fit the available space. Because this works, I no longer need the events I spoke of.
The only problem I have is that the resizing is bit counterintuitive. When I have 3 rows, and I resize the splitter between row 2 and 3, the resulting display jolts, resizing all 3 rows. I see what is happening - I'm actual resizing the tile in row 2, and the row 1 and 3 tiles are both adjusted to fit the new remaining space. The problem is that the bottom of tile 2 does't end up being where I let go of the mouse, and so it's a bit disorienting. As a user, it feels like it's not doing what you've asked it to do.
I was hoping there was a way to alter the resize behavior. If possible, I'd like a resize between row 2 and 3 to only effect the sizes of these 2 rows. Is a something like this possible?
Thanks again!
This link will give you some background in the TileLayout settings and their impact.
http://help.infragistics.com/NetAdvantage/WPF/2010.3/CLR4.0/?page=xamTilesControl_About_Tile_Layout.html
But let me also give you my code for setting the NormalModeSettings.
<igTiles:XamTilesControl.NormalModeSettings>
<igTiles:NormalModeSettings
MaxColumns="3"
MaxRows="2"
HorizontalTileAreaAlignment="Stretch"
VerticalTileAreaAlignment="Stretch">
<igTiles:NormalModeSettings.TileConstraints>
<igTiles:TileConstraints
PreferredHeight="300"
PreferredWidth="300"
MaxHeight="400"
MaxWidth="400"
MinWidth="200"
MinHeight="200"
/>
</igTiles:NormalModeSettings.TileConstraints>
</igTiles:NormalModeSettings>
</igTiles:XamTilesControl.NormalModeSettings>
I set the MaxColumns and MaxRows and the HorizontalTileAreaAlignment and VerticalTileAreaAlignment to control the layout and the force the tiles to fill the form when it is stretched. Along with that I set the TileConstraints for Preferred and Max and Min width and height to control the size of the tiles.
I’m not quite sure what kind of events you need; what you want to do, but there are a number of Tile events associated with the xamTilesControl (TileDragging, TileClosing, TIleStateChanging). If you can give me more direction I may be able to be more helpful.
If you’re interested in animation, this link may help.
Please let me know if you have further questions.