How to display Groupboxes in order of selection - c#

I need to a collection of groupboxes varying on the user selection. for example; there will be 7 groupboxes, the user can enable however many they want and in what order they want. So i want the selected groupbox B to appear at the bottom of the previously selected groupbox A yet when A is unselected B moves up the form to where A was.
In my mind i want it to behave similar to HTML items.
This will be done in WPF, coding in C#.

You can stack these groupboxes in a stackpanel with orientation=vertical. You can then set the Visibility of the groupboxex to the users decision and wpf will make the rest for you "by magic".
Little sample here:
<StackPanel Orientation="Vertical">
<GroupBox x:Name="First" Visibility="Visible" Header="First">
<Label>First</Label>
</GroupBox>
<GroupBox x:Name="Second" Visibility="Collapsed" Header="Second">
<Label>Second</Label>
</GroupBox>
<GroupBox x:Name="Third" Visibility="Visible" Header="Third">
<Label>Third</Label>
</GroupBox>
</StackPanel>

Put your GroupBoxes in a collection of some kind and databind that collection to a cusomised ListView. Whenever the selected state of a GroupBox changes update the view of that ListView to sort them based on your requirements. Unfortunately I am not good enough to provide a working sample in the time I have, sry.

Related

Controls overlapping tabitem wpf c#

I have a TabControl,inside one Tabitem, i have a grid and my userControl inside the grid:
<TabControl>
<TabItem>
<Grid HorizontalAlignment="Left" Height="64" Margin="288,150,0,0" VerticalAlignment="Top" Width="354">
<Canvas>
<local:MyCustomComboBox x:Name="ucc1" HorizontalAlignment="Left" Grid.RowSpan="2" Grid.ColumnSpan="3" Height="30" VerticalAlignment="Top" Width="194" ClipToBounds="True"/>
<Canvas>
</Grid>
<TabItem>
<TabControl>
By default,when the userControl's size is greater than the grid's/TabItem's size,the extra portion can't be seen.How can i make my UserControl overlap it ? I tried to add RowSpan and ColumnSpan but it didn't work :(
TabItem has it's own bounds which u cannot overlap.So,there's no way u can achieve your goal ... But i always try my best to help people, so here's a quick tip :
If the usercontrol is bigger than the gird
Your userControl XAML includes MyCustomComboBox, which makes me think it is a combobox..I've seen your previous post where you wanted to customize your combobox but couldn't quite achieve your goals...So, are you trying to create you own custom combobox and by usercontrol bigger than the grid , did u mean that the drop down menu u created doesn't go outside the grid rather is clipped to the grid ??
If this is the case , u can use a ContextMenu and move your custom drop-down list there.Then the contextMenu will overlap both the TabItem and Grid as it is a window itself.
Also , NOTE that u cannot use Named content in usercontrol(u can but that requires a workaround).So i suggest you to add all required code behinds , even set required binding from the user-control's code behind.
Hope this helps :)

Highlight part of text in textblock not working on all listboxItems

I'm trying to highlight part of text in a textblock from a listbox datatemplate which in turn is bounded to a property of a custom class by using a textbox to search the list for input text. But the problem is that only part of the items are highlighting (most of the ones visible) but when i maximize the window and try to input another character then suddenly all of them gets highlighted my guess where the problem might be is in this piece of code:
ListBoxItem listboxItemFound= (ListBoxItem)this.listBox1.ItemContainerGenerator.ContainerFromItem(TItem);
Since this method is returning a null when the items are not visible but the items are currently in the listbox. Somehow I guess the items listboxItem instances are not yet created until you scroll down or maximize to view more items.
XAML DataTemplate:
<DataTemplate>
<Grid Name="gridOfListbox" Height="25" Margin="0,2">
<DockPanel Name="dockpanelWithTxtBlock">
<TextBlock Name="textbloxk" DockPanel.Dock="Left" FontSize="15" TextAlignment="Center">
<Run Text="" /><Run Background="Yellow" Text="" /><Run Text="{Binding ProductID}" />
</TextBlock>
</DockPanel>
</Grid>
</DataTemplate>
If more code is needed just let me know.
Any help would be greatly appreciated!!
Also if there is any other better way of finding the listboxItem bounded to the custom Item just let me know. Thank you very much!
[Pic of problem] http://i.stack.imgur.com/HViag.png
One way to fix this is to set VirtualizingStackPanel.IsVirtualizing to false for your ListBox. This will cause all of the items to be created right away. The downside to this is if your ListBox has many items, your program will use more memory (since more items will be created), and could potentially run slower depending on the number of items.
A better solution to consider would be to have multiple DataTemplates for this - one without the highlight, and one with. You can set a DataTemplateSelector for your ListBox (using the ItemTemplateSelector property). The selector can choose which template to use based on if the item matches the search term or not.
The tricky part would be writing the template with the highlighted text. You could probably achieve that by having properties on the object the ListBoxItem is bound to for the text before the highlighted text, the highlighted text, and then the remaining text.

How can I design a region settings like this in WPF

Till now I have a combo-box control which displays all the available region language in the UI as a combo-box items.
its in WPF and MVVM
<ComboBox
x:Name="cbLanguage"
Grid.Row="1"
Height="30"
Width="200"
HorizontalAlignment="Center"
VerticalAlignment="Top"
ItemsSource="{Binding LocalLanguages,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
SelectedIndex="0">
But I saw this window and thought this looks much more legant and modern.
Can I do similar kind of window in WPF.
I tried to change the Combobox with list-box, List-view but no result.
Any help if there is any control in WPF which can do this.
This solves many problem specially if the combo box have more than 10 items user has to scroll through the all and then select the last index. But in this way user can select any locals as all are displayed in the UI. Even user can have the option to display alphabetically.
arraging items in 3 columns can be achieved by using UniformGrid as ItemsPanel
<ComboBox.ItemsPanel>
<ItemsPanelTemplate >
<UniformGrid Columns="3"/>
</ItemsPanelTemplate>
</ComboBox.ItemsPanel>
modify ItemTemplate to change items apperance and have green color for selected item
i think it is necessary to modify ComboBox template to have custom header and footer in a dropDown (Edit Template-Edit a Copy in Visual Studio designer)
In WPF combobox is basically a Popup when the toggle button is pressed.
You could implement your own popup or you could have a look at the template of the ComboBox. Here is a link to ComboBox template

How to get rid of double selection thing in ListView (XAML)

I have a ListView and I bind to an ObservableCollection<Folder> and when I hover over a ListViewItem, there is a second selection thing appearing underneath (or ontop of) the item text which prevents me from being able to "activate" the selected item because it doesn't appear to be receiving my click.
As you can probably see, the structure is:
ListView > ItemTemplate > DataTemplate > ListViewItem. But I'm guessing I have that double-selection thing because there are basically 2 "item templates" (DataTemplate and ItemTemplate). But if I get rid of DataTemplate, it throws a runtime error. If I get rid of ItemTemplate, it throws an error. I can't win. How do I get rid of this thing?
Update:
This gives me the desired effect:
<StackPanel x:Name="folderContainer" HorizontalAlignment="Left" VerticalAlignment="Stretch" Width="175" Background="Khaki" Margin="0, 18, 0, 0">
<ListView x:Name="folderList" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" ItemsSource="{Binding Folder}" BorderBrush="{x:Null}" BorderThickness="0">
<ListView.ItemTemplate>
<DataTemplate>
<TextBlock x:Name="folderItem" Text="{Binding Name}" />
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackPanel>
With the ListViewItem you where including a specialized wrapper primarily used the ListView to contain unknown item(s) presented by the binding of the ItemsSource when there is default template used. It helps to show that unknown item on the screen, its the purpose of the ListViewItem. For example if someone bound a list of strings, the strings have no xaml style on hover, hence there needs to be a container control to achieve all things graphical in those situations.
Why the two Shadows?
The actual ListViewItem is at its heart (or actually its property), a content control containing what I surmise you had was a textbox control. That is now two controls thanks to the DataTemplate you provided.
Hence you had a wrapper, with a content containing a texbox control. So there are two things which take up space, one is the ListViewItem and the other is the textbox. By hovering over each item, each's style kicked off to show the padding of the control as a selectable region in the Zorder fashion whereas both are seen.
Nothing more nothing less.
Since you knew what is to go into the content control, there was no need to use the ListViewItem wrapper, it was redundant, and you used the actual textbox; hence with only it's style to show the padding of the single control on hover.

Most simple FrameworkElement to handle HorizontalAlignment and VerticalAlignment?

This is Silverlight.
Initial goal is to display a random element in a Popup with some VerticalAlignment and HorizontalAlignment. I do not want to use VerticalOffset or HorizontalOffset, because there is more to what I really want to do, including some complex bindings.
First attempt was:
<Popup>
<Button
Height="135"
HorizontalAlignment="Stretch"
VerticalAlignment="Bottom" />
</Popup>
Second attempt was:
<Popup
Height="135"
HorizontalAlignment="Stretch"
VerticalAlignment="Bottom">
<Button />
</Popup>
Both were a failure: the Button was always on Top and not Stretch (HorizontalAlignment and VerticalAlignment didn't work).
So I had the idea to encapsulate the element in a simple FrameworkElement:
<Popup>
<Border>
<Button
Height="135"
HorizontalAlignment="Stretch"
VerticalAlignment="Bottom" />
</Border>
</Popup>
And it is working.
But I had to use Border in this example, when I could have done it with Grid and many other FrameworkElement (but not with Canvas or Viewbox or Popup). I'd like to know what is the most simple, efficient and processor-friendly transparent FrameworkElement to encapsulate another element with working HorizontalAlignment and VerticalAlignment? Is it:
Border? (like the above example)
UserControl?
ContentControl?
ContentContainer?
some custom and basic MyFrameworkElement? (might need help for most basic implementation)
something else like Grid?
WPF controls come in two flavors: Ones that interact with users (like accept user clicks like a button, or display text like a text block) and containers that control placement and layout of the previous ones.
Container controls are usually designed to lay out their children in a specific manner. For example, Canvases lay out children by X, Y, Width & Height values. Each one has a specific use, so you must read the documentation or tutorials for these container controls and understand how each works in order to select the appropriate one for a task.
In your case, you want the button to fill all available space in the popup (it seems, it isn't that clear). I know that the Grid does this by default. So I would do the following:
<Popup><Grid><Button /></Grid></Popup>

Categories

Resources