I'm using a Dockpanel via C# & WPF to display 2 user controls
The Left UserControl is a Datagrid with Filters (Called Filter)
The Right UserControl is a Custom Form That will change depending on what type of Data the user is viewing.
I'm setting the Dockpanel via this code
private void SetMasterDock(UIElement MyFilter, UIElement NewViewer)
{
MasterDock.Children.Clear();
DockPanel.SetDock(MyFilter, Dock.Left);
DockPanel.SetDock(NewViewer, Dock.Right);
MasterDock.Children.Add(MyFilter);
MasterDock.Children.Add(NewViewer);
}
All the above works as coded.
Now the Change I'm looking for (If possible)
I'd like to know what / how to enable the User to be able to Adjust the Scaling of the two Usercontrols. so if they wish to see More or less of one side or the other, they can just Click & Slide a Divider bar so they can adjust their view to their personal preferences.
ETA: New Code
MasterDock.Children.Clear();
Grid SplittableGrid = new Grid();
GridSplitter MovableDevider = new GridSplitter(); MovableDevider.Background = Brushes.Blue; MovableDevider.HorizontalAlignment = HorizontalAlignment.Right; MovableDevider.VerticalAlignment = VerticalAlignment.Stretch; MovableDevider.Width = 5;
ColumnDefinition LeftDefinition = new ColumnDefinition(); LeftDefinition.Width = new GridLength(200);
ColumnDefinition RightDefinition = new ColumnDefinition(); RightDefinition.Width = new GridLength(1,GridUnitType.Star);
SplittableGrid.ColumnDefinitions.Add(LeftDefinition);
SplittableGrid.ColumnDefinitions.Add(RightDefinition);
Grid.SetColumn(MyFilter, 0);
Grid.SetColumn(MovableDevider, 0);
Grid.SetColumn(NewViewer, 1);
SplittableGrid.Children.Add(MyFilter);
SplittableGrid.Children.Add(MovableDevider);
SplittableGrid.Children.Add(NewViewer);
DockPanel.SetDock(SplittableGrid, Dock.Left);
MasterDock.Children.Add(SplittableGrid);
in winforms the control you are looking for is the splitcontainer. However in WPF this is done using grid + gridSplitter. both of those controls are in the default toolbox.
Related
I need to hide a TextBlock that is child of a Border and is added to a Grid. The following code dynamically add the Border and the TextBlock to the Grid. Then if the Grid contain more than 5 children it hide the firsts children. It work correctly to hide the border but the TextBlock (the child of Border) remain visible.
Any idea where could be the problem? Thanks!
Border TextBorder = new Border();
TextBorder.BorderBrush = new SolidColorBrush(_settings.TextColor);
TextBorder.BorderThickness = new Thickness(0,0,0,2);
TextBorder.Padding = new Thickness(0, 10, 0, 10);
RowDefinition rd = new RowDefinition();
rd.Height = GridLength.Auto;
myGrid.RowDefinitions.Add(rd);
TextBlock uc = new TextBlock();
uc.Text = "Test";
TextBorder.Child = uc;
Grid.SetRow(TextBorder, myGrid.RowDefinitions.Count -1);
myGrid.Children.Add(TextBorder);
if (myGrid.Children.Count > 5)
{
Border border = (Border)myGrid.Children[myGrid.Children.Count - 6];
border.Visibility = Visibility.Hidden;
border.Child.Visibility = Visibility.Hidden;
}
Update
The code work correctly. The problem was in OnRender event of the TextBlock that draw the text with some graphic effect. I though that if the control is invisible OnRender should not be raised but it seams that it is raised also when the control is invisible. I have not found a way to prevent OnRender to be raised, nor ClipToBound nor Invisible work. So I give up with this approach and I just check in OnRender if the TextBlock is in the visible area of the container.
first of all, I think what you do is something you should not do!
But here is how you can do it (btw this assumes you only add Borders to your grid):
if (myGrid.Children.Count > 5)
{
(myGrid.Children[myGrid.Children.Count - 6] as Border).Visibility = Visibility.Hidden;
}
also i recommend to remove not to hide the child as it will otherwise stay in existance without any point
myGrid.Children.Remove(myGrid.Children[0]);
When I add Popup to my XAML like this
<Grid>
...other controls
<Popup x:Name="popup" Width="200" Height="200" >
</Popup>
</Grid>
It behaves as though the popup is there even though I did not toggle IsOpen = true (but the space is blank so no popup is visible)
However when I do the same from the code behind (add a popup) like this, it works like it should, it doesn't interfere with any controls (i.e. shift them) and it pops up as expected over top the other controls.
Popup p = new Popup();
// Create some content to show in the popup. Typically you would
// create a user control.
Border border = new Border();
border.BorderBrush = new SolidColorBrush(Colors.Black);
border.BorderThickness = new Thickness(0);
StackPanel panel1 = new StackPanel();
panel1.Background = new SolidColorBrush(Colors.);
Button button1 = new Button();
button1.Content = "Close";
button1.Margin = new Thickness(5.0);
button1.Click += new RoutedEventHandler(Feedback_Click);
TextBlock textblock1 = new TextBlock();
textblock1.Text = "The popup control";
textblock1.Margin = new Thickness(5.0);
panel1.Children.Add(textblock1);
panel1.Children.Add(button1);
border.Child = panel1;
// Set the Child property of Popup to the border
// which contains a stackpanel, textblock and button.
p.Child = border;
// Set where the popup will show up on the screen.
p.VerticalOffset = 400;
p.HorizontalOffset = 150;
// Open the popup.
p.IsOpen = true;
Does anyone know how I can accomplish the same thing in the XAML?
There are two ways of using a Popup. It can be an overlay control or it can be defined in the layout (or added to the tree) and it will take space like a standard control.
To have an overlay popup but avoid defining the layout in code-behind and still u, two techniques are often used:
1) defining the popup content as a separate user control. Your event handlers like Feedback_Click would now be definded in code-behind of the UserControl
var p = new Popup { Child = new MyControl() };
p.IsOpen = true;
2) defining the popup content simply in xaml in ResourceDictionary.
I want to display one or more CheckBoxes on a tile in my Windows Phone app. This works already for TextBlocks, but with a CheckBox it shows only the Text of the CheckBox and not the Checkmark itself.
This is a sample of my code:
public void CreateTile()
{
StackPanel panel = new StackPanel();
panel.VerticalAlignment = VerticalAlignment.Top;
panel.Margin = new Thickness(7.0, 7.0, 7.0, 0);
panel.Width = 336;
panel.Height = 336;
panel.Orientation = Orientation.Vertical;
// Create and add a CheckBox for each task
foreach (var task in _tasks)
{
TextBlock textBlock = new TextBlock();
textBlock.TextWrapping = TextWrapping.Wrap;
textBlock.Style = App.Current.Resources["PhoneTextLargeStyle"] as Style;
textBlock.Foreground = new SolidColorBrush(Colors.White);
textBlock.Text = task.Text;
CheckBox checkBox = new CheckBox();
checkBox.IsChecked = task.IsDone;
checkBox.Content = textBlock;
panel.Children.Add(checkBox);
}
Grid layoutRoot = new Grid();
layoutRoot.Background = new SolidColorBrush(Colors.Blue);
layoutRoot.Width = 336;
layoutRoot.Height = 336;
layoutRoot.Children.Add(panel);
layoutRoot.Measure(new Size(336, 336));
layoutRoot.Arrange(new Rect(0, 0, 336, 336));
layoutRoot.UpdateLayout();
// Render grid into bitmap
WriteableBitmap bitmap = new WriteableBitmap(336, 336);
bitmap.Render(layoutRoot, null);
bitmap.Invalidate();
// Save background image for tile to isolated storage
Uri backgroundImage = TileHelper.SaveTileImage(bitmap);
}
If I create a tile with a background image created by the method above, the tile will look like this:
As you can see the text is displayed but there is no checkmark/square before the text.
I personally like to use Segoe UI Symbol as the Font Family in such situations. This gives me the flexibility to use Text and Symbols together while not messing around too much with code / images. SUS has great modern icons (or characters if you may call them) that are very much Metroish, I'd say.
Just open up Charmap (Win + R and type in charmap) and in the Font Select -> Segoe UI Symbol. Now you can select any character you like and paste into Visual Studio Editor itself. Yes, it works!
The symbol may not display properly in the Editor itself but it will at Runtime
Here are some suggestions:
Here are the corresponding characters:
☑
✅
Don't worry about them not looking right HERE. They should when you follow the above steps.
You can always "hack" it by using images of checkbox controls. Did you try to show created control in UI? i.e. adding it to page? Just to see if your code is executed correctly.
Or another solution would be to use check mark character - http://www.fileformat.info/info/unicode/char/2713/index.htm
I'll try to replicate this problem in my test app since it is strange that it does not work.
As we dynamically add controls to a web page, its location is automatically adjusted, one control will not place over another.
Can we do the same in windows Form Application.
I have to add dynamic label, textbox and buttons at last of an existing win form.
Take a look at the FlowLayoutPanel control.
Represents a panel that dynamically lays out its contents horizontally or vertically.
When you drop controls on the FlowLayoutPanel, it will take care of automatically spacing one from another. If you dock it to the form, such that it resizes with the form, then it will also handle moving controls to the next row / column as needed, so they don't become hidden beyond the boundaries of the form.
If you want to group some controls together, place them inside a Panel and then use that inside the FlowLayoutPanel. Here's some code to demonstrate:
for (var i = 0; i < 5; i++)
{
var panel = new Panel { BorderStyle = BorderStyle.FixedSingle, Width = 100, BackColor = Color.LightBlue };
panel.Controls.AddRange(
new Control[]
{
new Label { Text = "Title", Location = new Point(0, 0) },
new Label { Text = "Subtitle", Location = new Point(0, 25) }
});
flowLayoutPanel1.Controls.Add(panel);
}
So... did someone know how to make it?...
In a panel is easy, because we can set the "AutoScroll" property, to true... but groupbox doesn't have it.
Anyways... exists some way for it?, thanks in advance ;-).
Quite simple... Add a panel inside a group box.
Declare Group box object and Panel object which will contain the scroll bar by default and some of my Check box objects;I read somewhere that Group box's don't have scroll bar for aesthetic reasons(i hope it's not true, why not let the user make that call). Solution is simple, once you know that you will create a panel that will lay on top of your group box just to get your scroll bar.
private System.Windows.Forms.GroupBox grpDR;//GROUPBOX IN WHICH PANEL WILL OVERLAY
private System.Windows.Forms.Panel grpScrlDR;//PANEL WHICH WILL HAVE SCROLL BAR AND CONTAIN CHECK BOXES
private System.Windows.Forms.CheckBox chkDr2;
private System.Windows.Forms.CheckBox chkDr1;
private void InitializeComponent()
{
this.grpScrlDR = new System.Windows.Forms.Panel();
this.chkDr2 = new System.Windows.Forms.CheckBox();
this.chkDr1 = new System.Windows.Forms.CheckBox();
this.grpDR = new System.Windows.Forms.GroupBox();
this.grpScrlDR.SuspendLayout();
this.grpDR.SuspendLayout();
//
// grpScrlDR
// PANEL DETAILS ADDING CHECKBOX CONTROLS AND ENABLING AUTO SCROLL
this.grpScrlDR.AutoScroll = true;
this.grpScrlDR.Controls.Add(this.chkDr2);
this.grpScrlDR.Controls.Add(this.chkDr1);
this.grpScrlDR.Dock = System.Windows.Forms.DockStyle.Fill;
this.grpScrlDR.Location = new System.Drawing.Point(5, 336);
this.grpScrlDR.Name = "grpScrlDR";
this.grpScrlDR.Size = new System.Drawing.Size(175, 230);
this.grpScrlDR.TabIndex = 0;
//
// chkDr2
//
this.chkDr2.AutoSize = true;`
this.chkDr2.Location = new System.Drawing.Point(13, 45);
this.chkDr2.Name = "chkDr2";
this.chkDr2.Size = new System.Drawing.Size(54, 20);
this.chkDr2.TabIndex = 1;
this.chkDr2.Text = "Permit#";
this.chkDr2.UseVisualStyleBackColor = true;
this.chkDr2.CheckedChanged += new System.EventHandler(this.chkDr_CheckedChanged);
//
// chkDr1
//
this.chkDr1.AutoSize = true;
this.chkDr1.Checked = true;
this.chkDr1.CheckState = System.Windows.Forms.CheckState.Checked;
this.chkDr1.Location = new System.Drawing.Point(13, 22);
this.chkDr1.Name = "chkDr1";
this.chkDr1.Size = new System.Drawing.Size(54, 20);
this.chkDr1.TabIndex = 0;
this.chkDr1.Text = "Account";
this.chkDr1.UseVisualStyleBackColor = true;
this.chkDr1.CheckedChanged += new System.EventHandler(this.chkDr_CheckedChanged);
//
// grpDR
// GROUP BOX DETAILS - GROUP BOX IS ADDING PANEL CONTROLS
this.grpDR.Controls.Add(this.grpScrlDR);
this.grpDR.Font = new System.Drawing.Font("Microsoft Sans Serif", 9.75F, System.Drawing.FontStyle.Regular, System.Drawing.GraphicsUnit.Point, ((byte)(0)));
this.grpDR.Location = new System.Drawing.Point(5, 336);
this.grpDR.Name = "grpDR";
this.grpDR.Size = new System.Drawing.Size(175, 230);
this.grpDR.TabIndex = 46;
this.grpDR.TabStop = false;
this.grpDR.Text = "Report by";
this.grpDR.Visible = false;
}
The GroupBox cannot display a scroll bar. If you need a control similar to a GroupBox that can contain a scroll bar, see the Panel control
Read This Article - Find (The GroupBox cannot display a scroll bar) Text
If you need to add a panel inside of your GroupBox, Dock a Panel inside of the GroupBox and set the AutoScroll property on the docked Panel to true. You can then place any controls you need inside of the GroupBox on the Panel, which will scroll when necessary.
If you don't like the way that looks as you stated above, then you have two possible options:
There may be a way to hack (more like "abuse" in this situation) the GroupBox control by making calls into the native Win32 API to add a scrollbar. I rarely use native calls on managed controls, but I've done this in situations where, for instance, I need to disable the scroll bar on a ListView as ListView doesn't expose this property. Below I expose the native Win32 function for use in C#, just call SetScrollBarVisible to enable or disable the scrollbar as needed from your code (I have not tested this on a GroupBox):
If aesthetics is THAT important to you (not a bad thing, user experience is greatly underappreciated in many areas of the application development world) and adding a scroll bar to the GroupBox doesn't work/look good to you, you will need to find another solution. I would imagine the best solution would be to make your own control from the ground up that meets your expectations (or modify the scrollbar itself, no idea how to do this), though this is can be a lot more work than it might be worth.
Here is how I expose and call the Win32 function SetScrollBar from my C# code (sorry, the DllImport won't format as a code block for some reason):
[DllImport ("user32")]
private static extern long ShowScrollBar (long hwnd , long wBar, long bShow);
long SB_HORZ = 0;
long SB_VERT = 1;
long SB_BOTH = 3;
private static void SetScrollBarVisible (Control control, long sb, bool enable)
{
if (control != null) return;
if (enable)
ShowScrollBar(control.Handle.ToInt64(), sb, 1);
else
ShowScrollBar(control.Handle.ToInt64(), sb, 0);
}
To do this you would have to add 1 panel to the groupbox and set the autoscroll property to true.
Then you would add a second panel which would be large then the first panel.
On this second panel (StringPanel in the beleow code) you would add controls.
System.Windows.Forms.GroupBox StringsGroup;
System.Windows.Forms.Panel StingPanel;
System.Windows.Forms.Panel StringPanel2;
StringsGroup = new System.Windows.Forms.GroupBox();
StingPanel = new System.Windows.Forms.Panel();
StringPanel2 = new System.Windows.Forms.Panel();
//Add your controls to StringPanel
StingPanel.Size = new System.Drawing.Size(300, 800);
StringPanel2.Size = new System.Drawing.Size(325, 345);
StringPanel2.AutoScroll = true;
this.StringPanel2.Controls.Add(StingPanel);
this.StringsGroup.Controls.Add(this.StringPanel2);
Horizontal Scroll Bar Tip
If you have a panel where all the controls contained within it are anchored to the top (so that they are centered) you will never see the horizontal scroll bar. You need to have at least one control that is anchored left & top that disappears when the panel is too small to show it in order for the horizontal scroll bar to appear. I put a label with hidden text on the panel to accomplish this.
This little tidbit took me quite a while to discover! Hope it's helpful!
If you dont want scrollbars, but want your GroupBox to grow, you can edit these below properties from the Layout section as shown below.
AutoSize = true;
AutoSizeMode = GrowOnly;