maandag 2 juli 2007

Snaplines

Bij het gebruik van Controls in visual studio bij het creeren van windows applicaties bieden de meeste controls snaplines aan. Snaplines langs de randen van controls kunnen gebruikt worden om op een makkelijke manier controls uit te lijnen.



De control hierboven heeft 2 actieve snaplines. Eentje om de linker rand van het vierkant en eentje op de onder rand van het rode blok in de control. Deze user control biedt niets anders aan dan een vierkant blok met in de kern een rood blok.

Zelf heb ik aan deze control snaplines toe gevoegd. Het toeveogen van snaplines aan een control is heel eenvoudig. Visual studio kijkt bij het openen van een control naar of er een Designer attribute aanwezig is. Aan de hand van de Designer attribute kan Visual Studio bepalen welke class hij moet gebruiken als 'Designer'. In de Designer class zitten een aantal methodes die een aanta returns verwachten.

Door het overriden van deze functies/properties kan je zaken aanpassen. Door bijvoorbeeld het overriden van de property:
public override System.Collections.IList SnapLines

Kan je een nieuwe return value opgeven van bijvoorbeeld:
ArrayList snapLines = base.SnapLines as ArrayList;
snapLines.Add(new SnapLine(SnapLineType.Left, 50));

Door deze aktie heb je nu een snapline die 50 pixels rechs van de linker rand een linker rand toond.

In mijn control, de CenterSquare heb ik een flink aantal snaplines toegevoegd:

public class CenterSquareSnapLines : ControlDesigner
{

public override System.Collections.IList SnapLines {
get
{
ArrayList snapLines = base.SnapLines as ArrayList;
CenterSquare c = this.Control as CenterSquare;
if (c != null)
{
snapLines.Add(new SnapLine(SnapLineType.Left, c.BorderDistance));
snapLines.Add(new SnapLine(SnapLineType.Right, c.Height - c.BorderDistance));
snapLines.Add(new SnapLine(SnapLineType.Top, c.BorderDistance));
snapLines.Add(new SnapLine(SnapLineType.Bottom, c.Width - c.BorderDistance));
snapLines.Add(new SnapLine(SnapLineType.Top, 5));
}
else
{
//Debug message here!
}
return snapLines;
}
}

}//einde class

Deze designer heb ik vervolgens toegevoegd aan mijn CentrerSquare class door het designer attribute:
[Designer(typeof(CenterSquareSnapLines))]
public partial class CenterSquare : UserControl
{
//implementatie heir
}

Bijzonderheden:
De ControlDesigner class heeft een property Control die de huidige control in design time toont. Door het casten van deze control kan je bij alle properties komen.
De snaplines property is van het type Ilist compleet zonder type checking.
Snaplines hebben een snaplinetype enumeration let op, sommige items van de enumeration zijn niet altijd zichtbaar!
In design time in VS kan je op Alt klikken om de control zonder snaplines te verplaatsen.
In design time kan je in VS op Ctrl klikken om de control te kopieren.
Meer lezen over de designer kan op : http://msdn2.microsoft.com/en-us/library/ms171830.aspx

ps. Ik zal binnenkort eens kijken of ik een mooiere opmaak kan krijgen.

Geen opmerkingen: