We Keep Coding

Extended Textbox is behind other elements in WPF

It's the first time i am learning WPF with C#.
So i have a textbox which is extended when i click on a button. The problem is when i extend it,it remains behind my other elements(textboxes etc...)
Here is the xml code for the textbox.
<StackPanel Grid.Column="1" Grid.ColumnSpan="4" Grid.Row="3" Grid.RowSpan="5" Panel.ZIndex="0" Visibility="Collapsed" Name="descriptionPanel" Margin="2,0,0,0" Background="White">
<Border BorderBrush="DarkGray" BorderThickness="1" CornerRadius="5">
<StackPanel Orientation="Horizontal">
<TextBox Name="descriptionTextBoxExtended"
Margin="10,10,10,10"
Style="{StaticResource expandedTextBox}"
Text="{Binding Path=Description, Mode=TwoWay, ValidatesOnExceptions=true, NotifyOnValidationError=true, TargetNullValue=''}"
IsReadOnly="{Binding RelativeSource={RelativeSource AncestorLevel=1,AncestorType=Control}, Path=SecurityLevel2ReadOnly, Mode=OneWay}"
/>
<Button Name="descriptionHide" Style="{StaticResource MinusButton}" HorizontalAlignment="Right" VerticalAlignment="Bottom" Margin="0,0,10,10" Click="descriptionHide_Click" />
</StackPanel>
</Border>
</StackPanel>
And here is the C#
private void exDescription_Click(object sender, RoutedEventArgs e)
{
descriptionPanel.Visibility = Visibility.Visible;
}
This is how it looks when i run it before i click the extend button:
And this is how it looks when i extend the textbox:
I want all the highlighted components to be behind the textbox.

You should give us the code of the other elements beside "descriptionPanel", but as mm8 pointed out, it seems that your elements are not in the same Panel.

WPF window - other controls not responding to clicks after adding Hyperlink control

I am new to WPF,and have written a simple hello world type application in order to get started. The code I have so far is shown below:
WPF XAXML
<Window x:Name="wndMain" x:Class="MyApp.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:ews="clr-namespace:ExtraWindowStyles"
ResizeMode="NoResize"
ews:ExtraWindowStyles.CanMinimize="false"
ews:ExtraWindowStyles.CanMaximize="false"
Title="Hello World" Height="501.492" Width="842.285">
<Grid>
<GroupBox Header="Input Parameters" HorizontalAlignment="Left" Height="173" Margin="10,25,0,0" VerticalAlignment="Top" Width="801" >
<StackPanel Orientation="Horizontal" Margin="0,0,96,0">
<StackPanel Margin="10">
<Label FontWeight="Bold">First Group</Label>
<RadioButton x:Name="opt11">Option 1 - 1</RadioButton>
<RadioButton x:Name="opt12">Option 1 - 2</RadioButton>
<RadioButton x:Name="opt13">Option 1 - 3</RadioButton>
</StackPanel>
<StackPanel Margin="10">
<Label FontWeight="Bold" Content="Second Group"/>
<RadioButton x:Name="opt21" Content="Option 2 - 1"/>
<RadioButton x:Name="opt22" Content="Option 2 - 2"/>
<RadioButton x:Name="opt23" Content="Option 2 - 3"/>
</StackPanel>
</StackPanel>
</GroupBox>
<Separator HorizontalAlignment="Left" Height="80" Margin="17,203,0,0" VerticalAlignment="Top" Width="794"/>
<Button x:Name="btnSubmit" Content="Submit" HorizontalAlignment="Left" Height="34" Margin="632,203,0,0" VerticalAlignment="Top" Width="179" Click="btnExplore_Click" />
<Label Content="Results:" HorizontalAlignment="Left" Height="28" Margin="10,242,0,0" VerticalAlignment="Top" Width="161"/>
<Label Content="My App" HorizontalAlignment="Left" Height="23" Margin="696,439,0,0" VerticalAlignment="Top" Width="130" FontSize="9"/>
<TextBlock>
<Hyperlink NavigateUri="http://www.google.com" RequestNavigate="Hyperlink_RequestNavigate">
Click Here
</Hyperlink>
</TextBlock>
<Rectangle Fill="#FFF4F4F5" HorizontalAlignment="Left" Height="162" Margin="17,270,0,0" Stroke="Black" VerticalAlignment="Top" Width="794"/>
<Label x:Name="lblResult" Content="" HorizontalAlignment="Left" Height="157" Margin="17,275,0,0" VerticalAlignment="Top" Width="794"/>
</Grid>
</Window>
Code Behind..
private void Hyperlink_RequestNavigate(object sender, RequestNavigateEventArgs e)
{
Process.Start(new ProcessStartInfo(e.Uri.AbsoluteUri));
e.Handled = true;
}
If I comment out the Hyperlink control XAML (and its related backend code), I am able to select options, click the Submit button etc.
However, if I uncomment the Hyperlink control (and its associated backend code), The only thing that remains clickable, is the Url on the form - what's going on?

Just position your TextBlock and it won't take all space in the window and cover everything :
<TextBlock Width="100" Height="30">
<Hyperlink Background="Red" NavigateUri="http://www.google.com" >
Click Here
</Hyperlink>
</TextBlock>
Because the TextBlock is after submit button in XAML it is over.
You could also set Margin to position the TextBlock
Layout knowledge
Elements in a grid Stretch Horizontally and Vertically if no alignment is set.
Useful tip : If you click on the TextBlock tag, you'll see the extent of the TextBlock in the design view.
Often useful

How do i access a control within a hub section data template windows phone 8.1

Ok I have been working on an app for awhile now this is my first windows phone app I have made and I have been running into a problem. The way I designed my app is my start page is a hub control and I have two textboxs and a date picker on each page and some other controls. Now what I want to do is when I press the add button on a given section then I want to take all the strings from my various controls and add it to a textfile that I will later use. My problem is when I make the event for the button I cannot access the controls because they are inside the hubs data template. I have looked a many other examples on how to get around this they just dont seem to work and I cant make sense of them. So if anyone on here has the patience to kinda step me through the process that would be wonderful. Thank you for any help.
<Page.Resources>
<DataTemplate x:Key="DataTemplate1">
<Grid>
<TextBlock HorizontalAlignment="Left" Margin="85,7,0,0" TextWrapping="Wrap" Text=":" VerticalAlignment="Top" FontSize="21.333"/>
<TextBox x:Name="tbHours" LostFocus="tbHours_LostFocus" HorizontalAlignment="Left" Margin="0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" InputScope="Number" PlaceholderText=" hrs" Width="80"/>
<TextBox x:Name="tbMinutes" LostFocus="tbMinutes_LostFocus" HorizontalAlignment="Left" Margin="95,0,0,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" InputScope="Number" PlaceholderText=" min" Width="80"/>
<TextBlock HorizontalAlignment="Left" Margin="0,50,0,0" TextWrapping="Wrap" Text="Work date" VerticalAlignment="Top" FontSize="14.667"/>
<DatePicker LostFocus="DatePicker_LostFocus" HorizontalAlignment="Left" Margin="0,65,0,0" VerticalAlignment="Top" Width="127"/>
<AppBarButton x:Name="abtnAddHours" HorizontalAlignment="Left" Icon="Add" Label="" Margin="118,65,0,0" VerticalAlignment="Top" Click="abtnAddHours_Click"/>
</Grid>
</DataTemplate>
<DataTemplate x:Key="DataTemplate2">
<Grid>
<TextBlock HorizontalAlignment="Left" Margin="0,7,0,0" TextWrapping="Wrap" Text="$" VerticalAlignment="Top" FontSize="21.333"/>
<TextBox x:Name="tbExpenses" LostFocus="tbExpenses_LostFocus" HorizontalAlignment="Left" Margin="15,0,0,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" InputScope="Number" PlaceholderText=" 0.00" Width="100"/>
<TextBlock HorizontalAlignment="Left" Margin="0,45,0,0" TextWrapping="Wrap" Text="Expense date" VerticalAlignment="Top" FontSize="14.667"/>
<DatePicker x:Name="dtpkrExpenses" LostFocus="dtpkrExpenses_LostFocus" HorizontalAlignment="Left" Margin="0,60,0,0" VerticalAlignment="Top" Width="115"/>
<TextBlock HorizontalAlignment="Left" Margin="0,115,0,0" TextWrapping="Wrap" Text="Expense notes" VerticalAlignment="Top" FontSize="14.667"/>
<TextBox x:Name="tbNotes" LostFocus="tbNotes_LostFocus" HorizontalAlignment="Left" Margin="0,140,0,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" Width="200"/>
<AppBarButton x:Name="abtnAddExpense" HorizontalAlignment="Left" Icon="Add" Label="" Margin="193,128,0,0" VerticalAlignment="Top"/>
</Grid>
</DataTemplate>
<DataTemplate x:Key="DataTemplate3">
<Grid>
<TextBlock HorizontalAlignment="Left" Margin="0" TextWrapping="Wrap" VerticalAlignment="Top" FontSize="14.667" Text="Working hour rate" Height="20"/>
<TextBlock HorizontalAlignment="Left" Margin="0,32,0,0" TextWrapping="Wrap" VerticalAlignment="Top" FontSize="21.333" Text="$"/>
<TextBox x:Name="tbWage" LostFocus="tbWage_LostFocus" HorizontalAlignment="Right" Margin="0,25,237,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" InputScope="Number" PlaceholderText=" 0.00" Width="89"/>
<AppBarButton x:Name="abtnAddWage" HorizontalAlignment="Left" Icon="Add" Label="" Margin="92,14,0,0" VerticalAlignment="Top"/>
</Grid>
</DataTemplate>
</Page.Resources>
<Page.BottomAppBar>
<CommandBar ClosedDisplayMode="Compact">
<CommandBar.SecondaryCommands>
<AppBarButton Label="Reset"/>
</CommandBar.SecondaryCommands>
<AppBarButton x:Name="abtnSummary" Icon="List" Label="Summary" Click="abtnSummary_Click"/>
</CommandBar>
</Page.BottomAppBar>
<Grid>
<Hub x:Name="Hub" Header="Hours+" Background="{ThemeResource PhoneAccentBrush}">
<HubSection x:Name="sctnAddHours" Header="Add hours" ContentTemplate="{StaticResource DataTemplate1}"/>
<HubSection x:Name="sctnAddExpenses" Header="Add expenses" ContentTemplate="{StaticResource DataTemplate2}"/>
<HubSection x:Name="sctnWage" Header="Wage" Height="580" ContentTemplate="{StaticResource DataTemplate3}"/>
</Hub>
</Grid>

Use the Loaded event of the control you want to access and assign it to a local variable like this.
XAML
<AppBarButton x:Name="abtnAddHours" Loaded="abtnAddHours_Loaded" HorizontalAlignment="Left" Icon="Add" Label="" Margin="118,65,0,0" VerticalAlignment="Top" />
Code Behind
//local variable
private TextBlock _abtnAddHours;
//Loaded event of the TextBlock from the template
private void abtnAddHours_Loaded(object sender, RoutedEventArgs e)
{
_abtnAddHours = (TextBlock)sender;
//Add the event handler for the Click event
_abtnAddHours.Click += _abtnAddHours_Click;
}
private void _abtnAddHours_Click(object sender, RoutedEventArgs e)
{
//Put your logic here
}

WPF: How can I stretch the middle child in a DockPanel?

I added a DockPanel to a RadioButton element such that I can distribute the radio button label, a textbox and a button horizontally using 100% of the width.
Using LastChildFill="True"within the DockPanel stretches the last element. This works out nicely if the textbox is the last child in the panel. But, as the button is the last element and has a fixed width, the textbox should be stretched. However, there's no such property like 2ndChildFill="True".
My code looks like this:
<RadioButton HorizontalAlignment="Stretch"
HorizontalContentAlignment="Stretch">
<DockPanel >
<TextBlock VerticalAlignment="Center">in location:</TextBlock>
<TextBox Grid.Column="1" Margin="10,0,0,0">Path string</TextBox>
<Button HorizontalAlignment="Right"
Margin="10,0,0,0" Padding="3,0">...</Button>
</DockPanel>
</RadioButton>
And it gives me this:
Any ideas, hints to fix this? Many thanks in advance...

You need to set DockPanel.Dock attached property for your elements and leave TextBox as the last element:
<RadioButton HorizontalAlignment="Stretch"
HorizontalContentAlignment="Stretch">
<DockPanel LastChildFill="True">
<TextBlock DockPanel.Dock="Left"
VerticalAlignment="Center"
Text="in location:" />
<Button DockPanel.Dock="Right"
Margin="10,0,0,0"
Padding="3,0"
Content="..." />
<TextBox Margin="10,0,0,0">
Path string
</TextBox>
</DockPanel>
</RadioButton>

Accepted answer is fixing your problem but creates another one. If someone uses keyboard (TAB) to navigate through your interface, Button will be focused before TextBox. This could be very annoying on a long run. If you don't want to brake your tab orders use Grid instead of DockPanel:
<RadioButton HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" VerticalAlignment="Center">in location:</TextBlock>
<TextBox Grid.Column="1" Margin="10,0,0,0">Path string</TextBox>
<Button Grid.Column="2" HorizontalAlignment="Right" Margin="10,0,0,0" Padding="3,0">...</Button>
</Grid>
</RadioButton>
Alternative would be to control tab orders yourself using TabIndex attribute. This can be tricky though, especially when you display your control in a collection.
<RadioButton HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" TabIndex="0">
<DockPanel LastChildFill="True">
<TextBlock DockPanel.Dock="Left" VerticalAlignment="Center" Text="in location:" />
<Button DockPanel.Dock="Right" Margin="10,0,0,0" Padding="3,0" Content="..." TabIndex="2"/>
<TextBox Margin="10,0,0,0" TabIndex="1">Path string</TextBox>
</DockPanel>
</RadioButton>

Can't seem to set Combobox.Background

I'm developing a Turing Machine simulator for a class on theory, and I'm trying to change the background color of the input area based upon whether the machine would accept the language (basically, one color over the other depending on if it's valid input).
Since I want to provide a couple example inputs, it needs to be a ComboBox. Since the professor needs to test his own inputs, it must be editable as well. So, here we are.
I've tried setting the ComboBox.Background property both programmatically and using XAML (via the Property editor), and neither work. I have no problem setting ComboBox.Foreground, however.
Here is my XAML:
<Window x:Class="Turing.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Turing Machine Emulator" Height="400" Width="600" Loaded="onload" MinHeight="500" MinWidth="600">
<Grid>
<ComboBox x:Name="drpProblem" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="120" SelectionChanged="changeproblem"/>
<Label x:Name="lblDescription" Content="Language Description" Margin="135,7,90,0" VerticalAlignment="Top"/>
<Grid Margin="10,0,10,35" Height="24" VerticalAlignment="Bottom">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="10*"/>
<ColumnDefinition Width="1*"/>
<ColumnDefinition Width="10*"/>
</Grid.ColumnDefinitions>
<Label x:Name="lblLeft" Content="left" HorizontalContentAlignment="Right" VerticalContentAlignment="Center" Padding="0" Margin="0,0,10,0" FontFamily="Consolas"/>
<Label x:Name="lblRight" Content="right" Grid.Column="2" VerticalContentAlignment="Center" Padding="0" Margin="10,0,0,0" FontFamily="Consolas"/>
<Label x:Name="lblCenter" Content="cur" Grid.Column="1" Height="24" Padding="0" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" Background="#FFC5FFA4" FontFamily="Consolas" FontSize="16"/>
</Grid>
<Button x:Name="btnIterate" Content="Iterate" Margin="10,0,0,64" Height="20" VerticalAlignment="Bottom" Click="btnIterate_Click" HorizontalAlignment="Left" Width="236"/>
<!-- This one right here -->
<ComboBox x:Name="txtInput" Height="23" Margin="10,0,10,89" Text="Input String" VerticalAlignment="Bottom" FontFamily="Consolas" VerticalContentAlignment="Center" TextBoxBase.TextChanged="cboGetInput" BorderBrush="{x:Null}" Foreground="Black" Background="#FF874343" IsEditable="True" />
<TextBox x:Name="txtMs" Height="20" Margin="251,0,172,64" TextWrapping="Wrap" Text="wait (seconds)" VerticalAlignment="Bottom"/>
<Button x:Name="btnAutoRun" Content="AutoRun" Margin="0,0,10,64" Click="btnAutoRun_Click" Height="20" VerticalAlignment="Bottom" HorizontalAlignment="Right" Width="157"/>
<TextBox x:Name="txtTM" Margin="10,38,10,142" TextWrapping="Wrap" Text="Language" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" FontFamily="Consolas" FontSize="14"/>
<Button x:Name="btnLoadLang" Content="Load" Margin="10,0,10,117" Height="20" VerticalAlignment="Bottom" Click="changeproblem"/>
<StatusBar Height="30" VerticalAlignment="Bottom">
<TextBlock x:Name="stTXTName" Text="StateName"/>
<Separator/>
<TextBlock x:Name="stTXTDescription" Text="StateDescription"/>
<Separator/>
<TextBlock x:Name="stTXTTransition" Text="NextTransition"/>
<Separator/>
<TextBlock x:Name="stTXTNext" Text="NextState"/>
</StatusBar>
</Grid>
</Window>
and here is the code I'm using to try to change the colors around:
if (TM.AcceptsString(txtInput.Text))
{
txtInput.Background = Brushes.LightGreen;
txtInput.Foreground = Brushes.LightGreen;
}
else
{
txtInput.Background = Brushes.Pink;
txtInput.Foreground = Brushes.Pink;
}
The foreground changes as expected, but the background color never changes from the default White. Am I doing something wrong? Is there some component control within ComboBox that I need to be setting properties for, as I did with TextBoxBase.TextChanged?

Set the FlatStyle attribute of the ComboBox to FlatStyle.Flat. This resolved a similar issue I experienced when the Win 7 Aero theme is turned on: The backcolor of the ComboBox does not show up in the default FlatStyle setting FlatStyle.Standard.

I had a similar issue and was able to resolve it by auto-generating the template for the ComboBox in Visual Studio 2015 (Right Click ComboBox in Design Window -> Edit Template -> Edit a Copy)