dockpanelexample.png

The IParent interface helps in adding support for additional types of parent containers, such as DockPanel. I have plans to add a Generate method and perhaps Map/Reduce type methods to IParent, but for the moment these are the two primary methods:
        object Add<T>(object chain, string key, T args, System.Windows.Controls.Border itemToBind);
        void Remove(object chain, Border itemToRemove);
The DockPanel extensions allow positioning the composite at a dock position: Left, Right, Top, or Bottom. In this example, I add two composites, one docked left and one docked right. I then add elements (Rectangle and TextBlocks) to the Grid within each composite:

Remember that you aren't limited to just adding composites: you can still add regular non-composite elements to containers too, such as the button I've added here via the method AddExisting(). However, it is recommended to be consistent and leverage WPF Composites as much as possible. This may be especially beneficial in the future if I find time to build a selector engine similar to jQuery but for WPF.

Also, there is freedom to manually retrieve and change settings on individual elements in a composite even after they have been styled based on initial settings. For instance, in the very last line of the code below I change the vertical alignment of the "Click to remove" TextBlock to Top:

            //1. INITIALIZE - Initialize and set dimensions of the composite's grid
            DockPanel myDockPanel = new DockPanel();
            myDockPanel.Initialize(428D, 475.0D, ContainerType.Grid, 5, 3);            
            myDockPanel.SetCompositeGridDimensions<DockPanel>(97.00D, 300.00D, 3, 1, 90.00D, GridUnitType.Pixel, 90.00D, GridUnitType.Pixel);
            myDockPanel.LastChildFill = false;
            myDockPanel.Background = Brushes.White;

            //2. BEGIN SETTINGS . . . END SETTINGS - Add default settings/styling 
            myDockPanel.BeginSettings<DockPanel>()
                .SetTextColorToCol<DockPanel>(0, 1, 2, Brushes.Black)
                .SetTextPadding<DockPanel>(1, 0, new Thickness(3))
                .SetTextPadding<DockPanel>(2, 0, new Thickness(3))
                .SetTextWrapping<DockPanel>(2, 0, System.Windows.TextWrapping.Wrap)
                .SetVerticalAlignment<DockPanel>(1, 0, System.Windows.VerticalAlignment.Center)
                .SetFont<DockPanel>(1, 0, "Arial", 11, FontWeights.DemiBold, FontStyles.Italic)
                .Set<Rectangle, DockPanel>("Fill", Brushes.DarkGreen)
                .Set<Rectangle, DockPanel>("Stroke", Brushes.Black)
                .Set<Rectangle, DockPanel>("StrokeThickness", 3.00D)
                .Set<Rectangle, DockPanel>("Width", 90.00D)
                .Set<Rectangle, DockPanel>("Height", 90.00D)
                .Set<Rectangle, DockPanel>(0, 0, "Fill", Brushes.Red)
                .Set<Button, DockPanel>("HorizontalAlignment", HorizontalAlignment.Center)
                .SetAttachedProperty<Rectangle, DockPanel>(
                "Background", obj => { obj.SetValue(Rectangle.FillProperty, Brushes.LightSeaGreen); })
                .SetItemBorderSettings(double.NaN, double.NaN, Brushes.Gold, new Thickness(2))
                .EndSettings();
                        
            Button myButton = new Button() { Content = "Click to Change Text" };

            //Example of varying the dimensions of the Composite Grid for one particular composite
            GridSettings compositeGridSettings = myDockPanel.CreateCompositeGridDimensions<DockPanel>(
                428D, double.NaN, 1, 1, 428D, GridUnitType.Pixel, double.NaN, GridUnitType.Pixel);
         
             //3. BEGIN COMPOSITE . . . END COMPOSITE - Create the Composites and add them to the DockPanel
            myDockPanel.BeginComposite(dockguid0)
                .AddExisting<Button, DockPanel>(0, 0, myButton)
                .SubscribeEvent<Button, DockPanel>(0, 0, "Click", new RoutedEventHandler(myButton_Click))
                .EndComposite(new DockArgs(Dock.Top), compositeGridSettings);
            
            myDockPanel.BeginComposite(dockguid1)
                .AddAnything<Rectangle, DockPanel>(0,0)
                .AddText(1,0, "Hello World 1a")
                .AddText(2,0, "This is text at Row 2 Column 0")
                .EndComposite(new DockArgs(Dock.Left));

            myDockPanel.BeginComposite(dockguid2)
                .AddAnything<Rectangle, DockPanel>(0, 0)
                .AddText(1, 0, "Click to remove.")
                .AddText(2, 0, "This is text at Row 2 Column 0")
                .EndComposite(new DockArgs(Dock.Right))
                .SubscribeEventOnComposite<DockPanel>(dockguid2, 
                "PreviewMouseLeftButtonDown", new MouseButtonEventHandler(my_MouseSingleClick));

            //Default settings can still be changed at runtime for a particular composite
            myDockPanel.GetTextBlock(dockguid2, 1, 0).VerticalAlignment = VerticalAlignment.Top;

Last edited Jan 12, 2013 at 8:11 AM by stagathome0069, version 4

Comments

No comments yet.