We Keep Coding

WPF - combobox items is getting duplicated

I'm creating WPF application and in my settings panel I have couple of labels, textboxes, comboboxes and two buttons (Save) and (Cancel).
Xaml
<ComboBox x:Name="myCombobox" Grid.Column="1" Margin="18,372,4,0" VerticalAlignment="Top" Height="26" SelectionChanged="MyCombobox_SelectionChanged" />
I already have added items to my combobox :
myCombobox.Items.Add("Test1");
myCombobox.Items.Add("Test2");
myCombobox.Items.Add("Test3");
foreach (var item in myCombobox.Items)
if (item.Equals(Properties.Settings.Default.MyCombobox))
myCombobox.SelectedItem = item;
and added SelectionChanged event. This is how it looks:
private void MyCombobox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
if (myCombobox.SelectedItem.ToString().Equals("Test1"))
{
testGrid.Visibility = Visibility.Visible;
}
else if (myCombobox.SelectedItem.ToString().Equals("Test2") || myCombobox.SelectedItem.ToString().Equals("Test3"))
{
testGrid.Visibility = Visibility.Hidden;
}
}
When I click the Cancel button and restart my settings panel the items of my combobox are duplicated. (Same values twice).
I have tried to prevent this by adding to Cancel buttons click event
myCombobox.Items.Clear();
but at this point another problem exists (myCombobox.SelectedItem is null) and I get this error:
An exception of type 'System.NullReferenceException' occurred in
IdentificationStation.exe but was not handled in user code
How could I prevent comboboxes items to be duplicated? Or should I do the MyCombobox_SelectionChanged otherwice , any helps?

Can't you just avoid
'System.NullReferenceException'
by testing if myCombobox.SelectedItem is null on MyCombobox_SelectionChanged?
private void MyCombobox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
if (myCombobox.SelectedItem != null)
if (myCombobox.SelectedItem.ToString().Equals("Test1"))
{
testGrid.Visibility = Visibility.Visible;
}
else if (myCombobox.SelectedItem.ToString().Equals("Test2") || myCombobox.SelectedItem.ToString().Equals("Test3"))
{
testGrid.Visibility = Visibility.Hidden;
}
}
}
I don't think it's bad manner to do it like that.

Use this check to stop addition of duplicate items:
if(!myComboBox.Items.Contains("item"))
{
myComboBox.Items.Add("item");
}

How to run some code when a user control is at first showing in WPF

My main window has a tab control with many tabs. Each tab has a user control. In each user control, there are one or more datagrids that show certain data from DB. I do not want to load all the grids' data when my program started. I only want to execute the read DB data method when the user controls are first shown. Is there an event to do this? I tried Loaded event. But is is triggered at the starting up of my application, not when I click a tab page and show the user control.

There is another event that you can attach to the TabControl instead of the actual tab. Using the SelectionChanged event you can gain access to both the tabs removed (hidden) and the tabs shown (active).
You will then need to add a flag in your class to check if the tab has already been shown. Something like this should work.
readonly List<string> shownTabs;
public MainWindow()
{
InitializeComponent();
this.shownTabs = new List<string>();
this.tabCtrl.SelectionChanged += tabCtrl_SelectionChanged;
}
void tabCtrl_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
if(e.AddedItems.Count == 0)
return;
var tabItem = e.AddedItems[0] as TabItem;
if (tabItem == null)
return;
if(this.shownTabs.Contains(tabItem.Name))
return;
this.shownTabs.Add(tabItem.Name);
if (tabItem == this.tab1)
{
//TODO : tab 1 logic
}
else if (tabItem == this.tab2)
{
//TODO : tab 2 logic
}
}
Just note i used a list to hold references to the tabs that are loaded. Also in this instance the tabCtrl event will fire when the tabControl is built as the first tab is added to the selection. Therefore you may find that adding the event handler in the Constructor is a bad place and may need to be in another event. IE the loaded event.
Hope this helps.

<Grid>
<TabControl SelectionChanged="TabControl_SelectionChanged_1">
<TabItem x:Name="tabitem1" Header="abc" />
<TabItem x:Name="tabitem2" Header="xyz"/>
</TabControl>
</Grid>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private bool tab1ItemLoaded = false;
private bool tab2ItemLoaded = false;
private void TabControl_SelectionChanged_1(object sender, SelectionChangedEventArgs e)
{
if (tabitem1.IsSelected && !tab1ItemLoaded)
{
//load tab1 data
tab1ItemLoaded = true;
}
else if (tabitem2.IsSelected && !tab2ItemLoaded)
{
//load tab2 data
tab2ItemLoaded = true;
}
}
}
I hope this will give you an idea. It would be damn easy using MVVM using Commands but if you doing in code behind then u can try SelectionChanged event of TabControl

TextBox ScrollToEnd Glitches When Selecting if Text is Appeneded

I'm making a textbox to autoscroll to the end when text is added. However I wanted the option to not scroll the textbox when the mouse is over the textbox. I've done all that, but when the user selects text and the textbox receives an event to update the text, everything goes haywire.
Here's what I'm working with:
<TextBox Text="{Binding ConsoleContents, Mode=OneWay}" TextWrapping="Wrap"
IsReadOnly="True" ScrollViewer.VerticalScrollBarVisibility="Visible"
TextChanged="TextBox_TextChanged" MouseEnter="TextBox_MouseEnterLeave"
MouseLeave="TextBox_MouseEnterLeave" AllowDrop="False" Focusable="True"
IsUndoEnabled="False"></TextBox>
private void TextBox_TextChanged(object sender, TextChangedEventArgs e)
{
TextBox textBox = sender as TextBox;
if (textBox == null) return;
// ensure we can scroll
if (_canScroll)
{
textBox.Select(textBox.Text.Length, 0); //This was an attempt to fix the issue
textBox.ScrollToEnd();
}
}
private void TextBox_MouseEnterLeave(object sender, MouseEventArgs e)
{
TextBox textBox = sender as TextBox;
// Don't scroll if the mouse is in the box
if (e.RoutedEvent.Name == "MouseEnter")
{
_canScroll = false;
}
else if (e.RoutedEvent.Name == "MouseLeave")
{
_canScroll = true;
}
}
To further explain what haywire means, when the textbox receives and propertychanged event it sets the text and scrolls down to the end if the mouse is not hovering over it. If the mouse is hovering over it does not scroll. But if I select text and the textbox recives the propertychanged event the content gets updated, but the box does not scroll down. This is expected. The problem is that my selection then goes from where the cursor currently is to the top of the text. If I remove the cursor from the box, it continues fine but once the cursor returns, the box gets stuck at the top and cannot scroll down. I thought it might have been the cursor so I try to move it to the end but that solves nothing.
Any ideas?!
I've been ripping my hair out! Thanks!

You will need to handle the extra case of PropertyChanged event. Because the text is changed the control is updated. Because it updates it resets certain values, like cursor location and selected text and such.
You can try to temporarily save these settings like CaretIndex, SelectionStart and SelectionLength. Although I have no experience with this, so you will have to find out for yourself what values you want to keep.
You could also apply the same _canScroll check when the PropertyChanged event is triggered for the TextBox. This allows you to work with the text. But if the mouse leaves the Textbox you must wait for a new event before the latest text is shown.
You might also want to look into using IsFocused property. In my opinion it gives a nicer solution than the MouseEnter and MouseLeave event. But that's up to you of course.

Well it took all morning but here's how to do it:
<TextBox Text="{Binding ConsoleContents, Mode=OneWay}"
TextWrapping="Wrap" IsReadOnly="True" ScrollViewer.VerticalScrollBarVisibility="Visible" TextChanged="TextBox_TextChanged"
MouseEnter="TextBox_MouseEnterLeave" MouseLeave="TextBox_MouseEnterLeave" SelectionChanged="TextBox_SelectionChanged" AllowDrop="False" Focusable="True"
IsUndoEnabled="False"></TextBox>
public partial class ConsoleView : UserControl
{
private bool _canScroll;
// saves
private int _selectionStart;
private int _selectionLength;
private string _selectedText;
public ConsoleView(ConsoleViewModel vm)
{
InitializeComponent();
this.DataContext = vm;
_canScroll = true;
}
private void TextBox_TextChanged(object sender, TextChangedEventArgs e)
{
TextBox textBox = sender as TextBox;
if (textBox == null) return;
// ensure we can scroll
if (_canScroll)
{
// set the cursor to the end and scroll down
textBox.Select(textBox.Text.Length, 0);
textBox.ScrollToEnd();
// save these so the box doesn't jump around if the user goes back in
_selectionLength = textBox.SelectionLength;
_selectionStart = textBox.SelectionStart;
}
else if (!_canScroll)
{
// move the cursor to where the mouse is if we're not selecting anything (for if we are selecting something the cursor has already moved to where it needs to be)
if (string.IsNullOrEmpty(_selectedText))
//if (textBox.SelectionLength > 0)
{
textBox.CaretIndex = textBox.GetCharacterIndexFromPoint(Mouse.GetPosition(textBox), true);
}
else
{
textBox.Select(_selectionStart, _selectionLength); // restore what was saved
}
}
}
private void TextBox_MouseEnterLeave(object sender, MouseEventArgs e)
{
TextBox textBox = sender as TextBox;
if (textBox == null) return;
// Don't scroll if the mouse is in the box
if (e.RoutedEvent.Name == "MouseEnter")
{
_canScroll = false;
}
else if (e.RoutedEvent.Name == "MouseLeave")
{
_canScroll = true;
}
}
private void TextBox_SelectionChanged(object sender, RoutedEventArgs e)
{
TextBox textBox = sender as TextBox;
if (textBox == null) return;
// save all of the things
_selectionLength = textBox.SelectionLength;
_selectionStart = textBox.SelectionStart;
_selectedText = textBox.SelectedText; // save the selected text because it gets destroyed on text update before the TexChanged event.
}
}

In WPF, what is the best way to make buttons that insert special characters into multiple TextBoxes?

If I have multiple TextBoxes and other text insertion controls and I want to create some buttons that insert special characters into whichever TextBox is in focus, what is the best control for this and what properties should be set?
Requirements for the buttons:
Buttons do not steal focus when clicked.
Buttons can insert text (e.g. special characters) into any control that accepts keyboard input.
The cursor should move as if the user had entered the text on the keyboard.
If #2 is not possible, it will suffice to limit the controls to only TextBoxes.
NOTE: I do not want to make the buttons unfocusable, only such that they do not steal focus when clicked.

I'm not aware of any button that is not stealing focus when it is clicked, but in button click event handle you can return focus to previous owner. If I had to implement this I'd create an behavior that is attached to parent panel of all special textboxes and all buttons that are to insert some text.
<StackPanel>
<i:Interaction.Behaviors>
<local:TextBoxStateTracker/>
</i:Interaction.Behaviors>
<TextBox />
<Button Content="description" Tag="?" />
</StackPanel>
For sample simplicity I've put text that is to be inserted to textbox in Tag property.
public class TextBoxStateTracker : Behavior<Panel>
{
private TextBox _previouslySelectedElement;
private int _selectionStart;
private int _selectionLength;
protected override void OnAttached()
{
//after control and all its children are created find textboxes and buttons
AssociatedObject.Initialized += (x, y) =>
{
var textBoxElements = FindChildren<TextBox>(AssociatedObject);
foreach (var item in textBoxElements)
{
item.LostFocus += new RoutedEventHandler(item_LostFocus);
}
var buttons = FindChildren<Button>(AssociatedObject);
foreach (var item in buttons)
{
item.Click += new RoutedEventHandler(item_Click);
}
};
}
private void item_Click(object sender, RoutedEventArgs e)
{
if (_previouslySelectedElement == null) return;
//simply replace selected text in previously focused textbox with whatever is in tag property
var button = (Button)sender;
var textToInsert = (string)button.Tag;
_previouslySelectedElement.Text = _previouslySelectedElement.Text.Substring(0, _selectionStart)
+ textToInsert +
_previouslySelectedElement.Text.Substring(_selectionStart + _selectionLength);
_previouslySelectedElement.Focus();
_previouslySelectedElement.SelectionStart = _selectionStart + textToInsert.Length;
}
private void item_LostFocus(object sender, RoutedEventArgs e)
{
//this method is fired when textboxes loose their focus note that this
//might not be fired by button click
_previouslySelectedElement = (TextBox)sender;
_selectionStart = _previouslySelectedElement.SelectionStart;
_selectionLength = _previouslySelectedElement.SelectionLength;
}
public List<TChild> FindChildren<TChild>(DependencyObject d)
where TChild : DependencyObject
{
List<TChild> children = new List<TChild>();
int childCount = VisualTreeHelper.GetChildrenCount(d);
for (int i = 0; i < childCount; i++)
{
DependencyObject o = VisualTreeHelper.GetChild(d, i);
if (o is TChild)
children.Add(o as TChild);
foreach (TChild c in FindChildren<TChild>(o))
children.Add(c);
}
return children;
}
}
This does more or less what you described but it is far from perfect I think it is enough to get you started.

You need to do override the template of a Label and a TextBox.
requirements 1 and 2 - can be done inside the template for the Label which will act as a button.
requirement 3 - can be done inside the the template for the Textbox.
It's not easy...
you might need to learn alot of WPF styling, XAML and overriding the Control Template. maybe even creating a custom control.

WPF: Dropdown of a Combobox highlightes the text

When I type in the combobox I automatically opens enables the dropdown list
searchComboBox.IsDropDownOpen = true;
The problem here is - the text gets highlighted and the next keystrock overwrites the previous text.
How can I disable the text highlighting when ComboBox DropDown opens up?

I had this very same issue and like some of the users being new to WPF, struggled to get the solution given by Einar Guðsteinsson to work. So in support of his answer I'm pasting here the steps to get this to work. (Or more accurately how I got this to work).
First create a custom combobox class which inherits from the Combobox class. See code below for full implementation. You can change the code in OnDropSelectionChanged to suit your individual requirements.
namespace MyCustomComboBoxApp
{
using System.Windows.Controls;
public class MyCustomComboBox : ComboBox
{
private int caretPosition;
public override void OnApplyTemplate()
{
base.OnApplyTemplate();
var element = GetTemplateChild("PART_EditableTextBox");
if (element != null)
{
var textBox = (TextBox)element;
textBox.SelectionChanged += OnDropSelectionChanged;
}
}
private void OnDropSelectionChanged(object sender, System.Windows.RoutedEventArgs e)
{
TextBox txt = (TextBox)sender;
if (base.IsDropDownOpen && txt.SelectionLength > 0)
{
caretPosition = txt.SelectionLength; // caretPosition must be set to TextBox's SelectionLength
txt.CaretIndex = caretPosition;
}
if (txt.SelectionLength == 0 && txt.CaretIndex != 0)
{
caretPosition = txt.CaretIndex;
}
}
}
Ensure that this custom combo class exists in the same project. THen you can use the code below to reference this combo in your UI.
<Window x:Class="MyCustomComboBoxApp.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:cc="clr-namespace:MyCustomComboBoxApp"
Title="MainWindow" Height="350" Width="525" FocusManager.FocusedElement="{Binding ElementName=cb}">
<Grid>
<StackPanel Orientation="Vertical">
<cc:MyCustomComboBox x:Name="cb" IsEditable="True" Height="20" Margin="10" IsTextSearchEnabled="False" KeyUp="cb_KeyUp">
<ComboBoxItem>Toyota</ComboBoxItem>
<ComboBoxItem>Honda</ComboBoxItem>
<ComboBoxItem>Suzuki</ComboBoxItem>
<ComboBoxItem>Vauxhall</ComboBoxItem>
</cc:MyCustomComboBox>
</StackPanel>
</Grid>
</Window>
Thats it! Any questions, please ask! I'll do my best to help.
THanks to Einar Guðsteinsson for his solution!

Better late than never and if some one else hit this proplem he might use this.
There is away todo this if you override combobox.
First get handle on the textbox that is used in the template and register to selectionchanged event.
public override void OnApplyTemplate()
{
base.OnApplyTemplate();
var element = GetTemplateChild("PART_EditableTextBox");
if (element != null)
{
var textBox = (TextBox)element;
textBox.SelectionChanged += OnDropSelectionChanged;
}
}
private void OnDropSelectionChanged(object sender, RoutedEventArgs e)
{
// Your code
}
Then in the event handler you can set the selection again like you want it to be. In my case I was calling IsDropDownOpen in code. Saved selection there then put it back in the event handler. Ugly but did the trick.

Further to clsturgeon's answer, I have solved the issue by setting the selection when DropDownOpened event occurred:
private void ItemCBox_DropDownOpened(object sender, EventArgs e)
{
TextBox textBox = (TextBox)((ComboBox)sender).Template.FindName("PART_EditableTextBox", (ComboBox)sender);
textBox.SelectionStart = ((ComboBox)sender).Text.Length;
textBox.SelectionLength = 0;
}

I think in the Solution provided by Andrew N there is something missing as when I tried it out the Selection Changed event of the TextBox was placing the caret at the wrong place. So I made this change to solve that.
namespace MyCustomComboBoxApp { using System.Windows.Controls;
public class MyCustomComboBox : ComboBox
{
private int caretPosition;
public override void OnApplyTemplate()
{
base.OnApplyTemplate();
var element = GetTemplateChild("PART_EditableTextBox");
if (element != null)
{
var textBox = (TextBox)element;
textBox.SelectionChanged += OnDropSelectionChanged;
}
}
private void OnDropSelectionChanged(object sender, System.Windows.RoutedEventArgs e)
{
TextBox txt = (TextBox)sender;
if (base.IsDropDownOpen && txt.SelectionLength > 0)
{
caretPosition = txt.SelectionLength; // caretPosition must be set to TextBox's SelectionLength
txt.CaretIndex = caretPosition;
}
if (txt.SelectionLength == 0 && txt.CaretIndex != 0)
{
caretPosition = txt.CaretIndex;
}
}
}

When a comboxbox gains focus you can disable the text highlighting (i.e. by selecting no text upon the GotFocus event). However, when you pulldown the combobox the system is going to locate the item in the list and make that the selected item. This in turn automatically highlights the text. If I understand the behaviour you are looking for, I do not believe it is fully possible.

I was able to fix it using a modified answer from Jun Xie. Assuming you are using the keyUp event for your combobox search, I found an edge case in my custom use case that would still overwrite the text:
Type in the combobox for the first time. Text is fine.
Use up and down arrow keys to select an item in the list, but not "committing" the change (pressing enter, for example, and closing the dropDown selections. Note the text is highlighted at this point like clsturgeon points out.
Try to type in the textbox again. In this case the text will be over-ridden because the dropdown was still open hence the event never fired to clear the highlight.
The solution is to check if an item is selected. Here's the working code:
XAML:
<ComboBox x:Name="SearchBox" IsEditable="True" KeyUp="SearchBox_KeyUp"
PreviewMouseDown="SearchBox_PreviewMouseDown" IsTextSearchEnabled="False"
DropDownOpened="SearchBox_DropDownOpened">
</ComboBox>
Code:
private void SearchBox_KeyUp(object sender, KeyEventArgs e)
{
SearchBox.IsDropDownOpen = true;
if (e.Key == Key.Down || e.Key == Key.Up)
{
e.Handled = true;
//if trying to navigate but there's noting selected, then select one
if(SearchBox.Items.Count > 0 && SearchBox.SelectedIndex == -1)
{
SearchBox.SelectedIndex = 0;
}
}
else if (e.Key == Key.Enter)
{
//commit to selection
}
else if (string.IsNullOrWhiteSpace(SearchBox.Text))
{
SearchBox.Items.Clear();
SearchBox.IsDropDownOpen = false;
SearchBox.SelectedIndex = -1;
}
else if (SearchBox.Text.Length > 1)
{
//if something is currently selected, then changing the selected index later will loose
//focus on textbox part of combobox and cause the text to
//highlight in the middle of typing. this will "eat" the first letter or two of the user's search
if(SearchBox.SelectedIndex != -1)
{
TextBox textBox = (TextBox)((ComboBox)sender).Template.FindName("PART_EditableTextBox", (ComboBox)sender);
//backup what the user was typing
string temp = SearchBox.Text;
//set the selected index to nothing. sets focus to dropdown
SearchBox.SelectedIndex = -1;
//restore the text. sets focus and highlights the combobox text
SearchBox.Text = temp;
//set the selection to the end (remove selection)
textBox.SelectionStart = ((ComboBox)sender).Text.Length;
textBox.SelectionLength = 0;
}
//your search logic
}
}
private void SearchBox_DropDownOpened(object sender, EventArgs e)
{
TextBox textBox = (TextBox)((ComboBox)sender).Template.FindName("PART_EditableTextBox", (ComboBox)sender);
textBox.SelectionStart = ((ComboBox)sender).Text.Length;
textBox.SelectionLength = 0;
}

An alternative. Prevent the framework from messing with selection.
public class ReflectionPreventSelectAllOnDropDown
{
private static readonly PropertyInfo edtbPropertyInfo;
static ReflectionPreventSelectAllOnDropDown()
{
edtbPropertyInfo = typeof(ComboBox).GetProperty("EditableTextBoxSite", BindingFlags.NonPublic | BindingFlags.Instance);
}
public void DropDown(ComboBox comboBox)
{
if (!comboBox.IsDropDownOpen)
{
var edtb = edtbPropertyInfo.GetValue(comboBox);
edtbPropertyInfo.SetValue(comboBox, null);
comboBox.IsDropDownOpen = true;
edtbPropertyInfo.SetValue(comboBox, edtb);
}
}
}