We Keep Coding

Is this concept of a button containing a textbox possible?

Recently I had been looking for a way to make the tabs in a TabControl editable and came across This example on telerik's website. That did exactly what I wanted but it got me thinking about a similar usage for buttons. I was wondering if it would be possible to use something like that and make a button that would show a textbox instead of the content presenter when say, you right click the button? I tried to make something like this work but so far have only ended up with a blank button.
<Button x:Name="SB" Height="222" Width="222" Click="SB_Click">
<ContentControl.ContentTemplate>
<DataTemplate>
<local:SuperButton Content="{Binding Path=x, Mode=TwoWay}"/>
</DataTemplate>
</ContentControl.ContentTemplate>
</Button>
Where x is a string variable and using the code behind from the link above (with a class name change, of course).
edit: This button will be in an itemscontrol, so I don't think naming the inner elements in xaml will work, but I do like the ease of Wolfgang's answer.

The WPF Content Model is really flexible and allows literally anything inside anything.
This is perfectly valid XAML:
<Button>
<TextBox/>
</Button>
Or even:
<Button>
<MediaElement Source="C:\Videos\WildLife.wmv"/>
</Button>

You can simply host a (e.g.) label (TextBlock) with the text AND a TextBox inside the Button and set their Visiblity properties.
That way, if you right click the button, the TextBox shows up.
<Button>
<Grid>
<TextBox Text=normal button caption" x:Name="label" />
<TextBox
x:Name="textbox"
Text="visible on right click"
MouseRightButtonDown="HandleRightClick"/>
</Grid>
</Button>
And then in your C# code create an event handler to set the Visiblity correctly.
void HandleRightClick(object sender, MouseButtonEventArgs e)
{
label.Visibility = Visibility.Collapsed;
textBlock.Visibility = Visibility.Visible;
}

WPF togglebutton

I've got an issue with a custom WPF button - whenever I click on it, it receives a click event but does not seem to get toggled (does not stay down when I click on another button). I've tried everything I can think of and still can't get it to work.
One weird thing that I have noticed though is that when I put a breakpoint in the MouseDown handler and just hit F5 to continue at that point, the button gets toggled and stays down. This leads me to believe that this is some sort of focus issue?
<ToggleButton Name="ToggleButton" PreviewMouseDown="ToggleButton_MouseDown_1" IsThreeState="False">
<StackPanel Orientation="Vertical">
<Label Content="Single" FontSize="15" FontWeight="Medium"/>
<Label Content="Speaker"/>
</StackPanel>
</ToggleButton>
private void ToggleButton_MouseDown_1(object sender, MouseButtonEventArgs e)
{
ToggleButton.IsChecked = !ToggleButton.IsChecked;
}
private void ToggleButton_MouseDown_1(object sender, MouseButtonEventArgs e)
{
ToggleButton.IsChecked = !ToggleButton.IsChecked;
}
Help? :)

As #Nick said in his comment, just remove your event handler PreviewMouseDown="ToggleButton_MouseDown_1" completely and it should work just fine.
If this is not the case you must have some other code which is causing the issue.

It sounds like you want the functionality of a set of radio buttons, but the look of a bunch of toggle buttons. In cases like these, using the inherited Control.Template property is really handy:
In your page resources, you can add:
<Style TargetType="RadioButton">
<Setter Property="Template">
<Setter.Value>
<ContentTemplate>
<ToggleButton Content="{TemplateBinding Content}" IsChecked="{TemplateBinding IsChecked}"/>
</ContentTemplate>
</Setter.Value>
</Setter>
</Style>
And then in your code:
<RadioButton Content="MyContent" GroupName="MyGroup"/>
This should make an object that looks like a toggle button, but deselects when you select something from the same group, like a RadioButton. You can further modify the ToggleButton in the Template until you get the look that you want.

Remove WPF IsDefault

I have 3 conrtols placed on my Window in WPF, each control contains one or more TextBox and Button, when a new control is selected I would like to change the IsDefault to that button. What I am currently doing is when the TextBox's GotFocus event is fired, I change my Button to IsDefault. This works the first time but when I change from one control to another, and back to the first selected control the second controls IsDefault is still true and when enter is pressed it fires the Click event on the incorrect control.
Is there a way that i can clear all IsDefault properties on my window or what is a better solution to my current way of doing this? See image below for example, when enter is pressed the Button with "..." is fired instead of quick search.
XAML (Update)
<odc:OdcTextBox Text="{Binding AccountNumber, UpdateSourceTrigger=PropertyChanged}" MinWidth="100" Name="txtAccountNumber" Grid.Row="1" Grid.Column="1" VerticalAlignment="Center" Margin="{Binding TextMargin}">
<odc:OdcTextBox.Buttons>
<Button IsDefault="{Binding ElementName=txtAccountNumber, Path=IsKeyboardFocusWithin}" Width="30" Style="{StaticResource DionysusButton}" x:Name="btnCdv" Content="...">
</Button>
</odc:OdcTextBox.Buttons>
</odc:OdcTextBox>

<Button IsDefault={Binding IsKeyboardFocusWithin, ElementName=ThisGroupBox} />
EDIT:
Your code is slightly different in that you are providing buttons to some custom control. These buttons are declared in a different scope to where they end up (ie I assume they end up inside the OdcTextBox template somewhere). I suspect this is why WPF can't find the named element since that element is named in an outer scope.
You could try using RelativeSource to find the parent OdcTextBox instead:
<Button IsDefault="{Binding IsKeyboardFocusWithin, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type odc:OdcTextBox}}}"
Width="30" Style="{StaticResource DionysusButton}" x:Name="btnCdv" Content="...">

Similarly to how you're using the TextBox GotFocus event, you could do the inverse of this and use the LostFocus event to reset the IsDefault Property

send string from usercontrol to appliucation page

I need to send a string(TextBlockName.Text) from usercontrol to application page after clicking on the button.
Application page XAML:
<ListBox x:Name="lstFlags">
<ListBox.ItemTemplate>
<DataTemplate>
<local:ListItem />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
UserControl "ListItem" с# code:
public partial class ListItem : UserControl
{
...
private void Button_Click(object sender, RoutedEventArgs e)
{
}
}
User control Xaml:
<Button Click="Button_Click">
<TextBlock Name="TextBlockName" Text="{Binding ShortName}" />
</Button>
So. I think it is necessary to generate event in application page when button clicked. How can I do this?

I think what you're trying to ask here is how you can send the textblock1.Text (for example) value to the code behind.
By the looks of it, you're using Data Binding to bind the data, but you also have a Button_Click event.
Generally I use one or the other (unless i'm doing something complex), if you simply want to get the Text value form the TextBlock, then you can either do:
<TextBlock Name="textBlockName" Text="{Binding ShortName}" Mode="TwoWay">
The Mode="TwoWay" ensures that the value of the Text Block gets sent to and from the code-behind object, in this case calledShortNameand to theTextBlock.Text`.
The other method is to simply create a Button click event which you already seem to have. In the Button Click event, simply do the following:
string myString = textBlock1.Text;
As you can guess, that simply gets the string value that's within the Text property of the textBlock and puts it inside the myString object.
But - as an important note, you should try to elaborate as much as possible to ensure that people who are viewing your question understand and can help you.

How to implement "Mega Menus" in WPF?

I'm trying to implement "Mega Menu" style menus using WPF. To see examples of mega menus in web design, see here.
So far, I've tried creating a similar interface by using TextBlocks as the highest level of the menu, and then using the mouse hover event to display an additional window that appears positioned below the text block. This is cumbersome and inflexible, future changes would require adding/removing TextBlocks dynamically.
I have considered using the WPF Menu control, because I know the styles can be dramatically modified, but I haven't seen any way to produce multi-column layouts with the hierarchical model that the Menu control uses.
Is there a better way to do this? Am I going to have to stick with custom windows and relative positioning? Can someone point me to an example of this that has already been implemented?

Instead of using custom Windows and positioning, you could use a Popup control. Your can use the StaysOpen=false setting to have it close when the user clicks off-screen.
If you can settle for clicking a menu item instead of hovering, the following custom control will work:
[TemplatePart(Name="PART_HoverArea", Type=typeof(FrameworkElement))]
[TemplatePart(Name="PART_Popup", Type=typeof(Popup))]
public class MegaMenuItem : HeaderedContentControl
{
private FrameworkElement hoverArea;
private Popup popup;
public override void OnApplyTemplate()
{
base.OnApplyTemplate();
// Unhook old template
if (hoverArea != null)
{
hoverArea.PreviewMouseUp -= ShowPopupOnMouseDown;
}
hoverArea = null;
popup = null;
if (Template == null)
return;
// Hook up new template
hoverArea = (FrameworkElement)Template.FindName("PART_HoverArea", this);
popup = (Popup)Template.FindName("PART_Popup", this);
if (hoverArea == null || popup == null)
return;
hoverArea.PreviewMouseUp += ShowPopupOnMouseDown;
}
private void ShowPopupOnMouseDown(object sender, MouseEventArgs e)
{
popup.PlacementTarget = hoverArea;
popup.Placement = PlacementMode.Bottom;
popup.StaysOpen = false;
popup.IsOpen = true;
}
}
You would need a style to display it - something like this. Note the PART_ template part names:
<Style TargetType="WpfApplication14:MegaMenuItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="WpfApplication14:MegaMenuItem">
<Grid>
<Border Name="PART_HoverArea" Background="#fb9c3b" BorderBrush="White" BorderThickness="0,0,1,0">
<ContentPresenter Content="{TemplateBinding Header}" />
</Border>
<Popup
Name="PART_Popup"
PlacementTarget="{Binding ElementName=HoverArea}"
>
<Border MinWidth="100" MaxWidth="400" MinHeight="40" MaxHeight="200" Background="#0d81c3">
<ContentPresenter Content="{TemplateBinding Content}" />
</Border>
</Popup>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
The XAML for your menu would then be:
<StackPanel Orientation="Horizontal" VerticalAlignment="Top">
<WpfApplication14:MegaMenuItem Header="Parent 1">
<WrapPanel Margin="5">
<TextBlock Text="Put any content you want here" Margin="5" />
<TextBlock Text="Put any content you want here" Margin="5" />
<TextBlock Text="Put any content you want here" Margin="5" />
</WrapPanel>
</WpfApplication14:MegaMenuItem>
<WpfApplication14:MegaMenuItem Header="Parent 2">
<WrapPanel Margin="5">
<TextBlock Text="Put any content you want here" Margin="5" />
<TextBlock Text="Put any content you want here" Margin="5" />
<TextBlock Text="Put any content you want here" Margin="5" />
</WrapPanel>
</WpfApplication14:MegaMenuItem>
</StackPanel>
Making the menu appear on hover is much harder, because of the way Popups steal focus (you can show the menu, but you can't easily hide it if they mouse over another menu). For that a custom window might work better.

You could use a HeaderedItemsControl and swap out the Panel to suit your needs; by default it uses a StackPanel however a WrapPanel may suit you better. The pop out and mouse over behavior do not exist by default and would need to be implemented.
A more robust approach would be to leverage a custom Expander; as it provides the pop out behavior you are after and the linked to walkthrough provides the mouse over behavior.

I wonder if the Ribbon control can be retrofitted to do this? It provides tabs, labels, columns and all that.
Please use this UI design sparingly and make sure that it only opens and closes when the user specifically requests such. It's tremendously annoying when a popup mega-menu appears over a website I'm viewing, and I can't get it to close, except for when I want to click on it and it goes away.

Custom windows and relative position are essentially how the WPF Menu/MenuItem control works... but as you've found, it's non-trivial. Best bet would be to retemplate the Menu/MenuItem controls to meet your need.