Develop Reference

TextBox inside an Ellipse WPF

I am trying to add filtering to my WPF app, so I figured that I want to have an ellipse, and inside it will be a TextBox whose Text will be bound to a FilterText property in my ViewModel.
What I have tried:
<TextBox
Width="30"
Height="30">
<TextBox.Template>
<ControlTemplate>
<Grid>
<Ellipse Stroke="Black" StrokeThickness="1" />
<ContentPresenter
HorizontalAlignment="Center"
VerticalAlignment="Center"
Content="{Binding FilterText, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
TextElement.Foreground="Black" />
</Grid>
</ControlTemplate>
</TextBox.Template>
</TextBox>
I took this from the same example, but with Label.
This displays the ellipse, but no TextBox inside it.
How can I create an ellipse WITH a TextBox?

Try this
<Grid>
<Ellipse Stroke="Black" StrokeThickness="1"/>
<TextBox Text="{Binding FilterText, UpdateSourceTrigger=PropertyChanged}"
VerticalAlignment="Center" HorizontalAlignment="Center"/>
</Grid>

Fixed it by wrapping the TextBox inside a Border and setting the Border's CornerRadius:
<Border
Width="30"
Height="30"
BorderBrush="Black"
BorderThickness="1"
CornerRadius="30">
<TextBox
HorizontalAlignment="Center"
VerticalAlignment="Center"
HorizontalContentAlignment="Center"
VerticalContentAlignment="Center"
Background="Transparent" //important to lose the TextBox look
BorderBrush="Transparent" //important to lose the TextBox look
BorderThickness="0" //important to lose the TextBox look
Text="{Binding FilterText, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
</Border>

How do you add a flyout message to a WPF button using XAML

Below is my xaml for a button I would like to have a message fly out from:
<Button x:Name="ClearButton" HorizontalAlignment="Left"
Width="90" Margin="0,0,0,0"
Click="ClearButton_Click">
<StackPanel Orientation="Horizontal" Margin="-15,0,0,5" >
<Image Source="{StaticResource EraseButtonImageKey}"
Margin="5,0,0,0" Height="20" Width="20" />
<TextBlock VerticalAlignment="Center"
Padding="0,0,0,0" Margin="2,0,0,0">Clear</TextBlock>
</StackPanel>
</Button>
I would like to have a small single line of text fly out when a mouse pointer moves over a button in WPF. For example, if you are using the Chrome browser a small line of text fly's out when you move your cursor over the back arrow at the top which says "click to go back". How can I have a message like that pop out when I move a mouse pointer over a WPF button? The message I want displayed for my button would be "Removes all text from the results window."
Thanks in advance.
---- UPDATE FEB 9, 2019 ------
Thanks to the comment from the.doc I updated my code to the following which now gives me the result I was looking for:
<Button x:Name="ClearButton" HorizontalAlignment="Left"
Width="90" Margin="0,0,0,0"
Click="ClearButton_Click">
<StackPanel Orientation="Horizontal" Margin="-15,0,0,5" >
<Image Source="{StaticResource EraseButtonImageKey}"
Margin="5,0,0,0" Height="20" Width="20" />
<TextBlock VerticalAlignment="Center"
Padding="0,0,0,0" Margin="2,0,0,0">Clear</TextBlock>
</StackPanel>
<Button.ToolTip>
<ToolTip>
<StackPanel>
<TextBlock FontWeight="Bold">Removes all text from the result window</TextBlock>
</StackPanel>
</ToolTip>
</Button.ToolTip>
</Button>

Below is the solution to the problem I had by using the Button.ToolTip feature which The.Doc suggested:
<Button x:Name="ClearButton" HorizontalAlignment="Left"
Width="90" Margin="0,0,0,0"
Click="ClearButton_Click">
<StackPanel Orientation="Horizontal" Margin="-15,0,0,5" >
<Image Source="{StaticResource EraseButtonImageKey}"
Margin="5,0,0,0" Height="20" Width="20" />
<TextBlock VerticalAlignment="Center"
Padding="0,0,0,0" Margin="2,0,0,0">Clear</TextBlock>
</StackPanel>
<Button.ToolTip>
<ToolTip>
<StackPanel>
<TextBlock FontWeight="Bold">Removes all text from the result window</TextBlock>
</StackPanel>
</ToolTip>
</Button.ToolTip>
</Button>

StackPanel ZIndex not working

I want to achieve something like this, where there is that visible border (left of 'Market summary') vertically.
I have a grid, two columns (the left part = picture, name, email, listbox) and right part everything else). I tried to show that border by bringing the StackPanel which is found on the left column to the front using Panel.Zindex but that didn't do anything.
<StackPanel Panel.ZIndex="1" Grid.Column="0">
<materialDesign:ColorZone Height="100" Mode="PrimaryMid">
<Border Padding="8">
<StackPanel>
<Ellipse HorizontalAlignment="Left" VerticalAlignment="Top" Width="48" Height="48" RenderTransformOrigin="-0.014,0.003" Margin="0,0,104,0">
<Ellipse.Fill>
<ImageBrush ImageSource="RandomPic.jpg" />
</Ellipse.Fill>
</Ellipse>
<TextBlock Text="UsernameX" ></TextBlock>
<TextBlock Text="EmailY" ></TextBlock>
</StackPanel>
</Border>
</materialDesign:ColorZone>
<ListBox Background="#FAFAFA" x:Name="DemoItemsListBox">
<ListBox.Items>
<TextBlock> What's going on</TextBlock>
<TextBlock>What's going on</TextBlock>
<TextBlock>What's going on</TextBlock>
<TextBlock>What's going on</TextBlock>
</ListBox.Items>
</ListBox>
</StackPanel>
<StackPanel Panel.ZIndex="0" Grid.Column="1">
<materialDesign:ColorZone Panel.ZIndex="0" Height="60" Mode="PrimaryMid" />
<!--
<dragablz:TabablzControl BorderBrush="#4CAF50" BorderThickness="0" Height="56" >
<TabItem Header=" Ordre de mission " IsSelected="True">
<TextBlock><Run Text="Hello World"/></TextBlock>
</TabItem>
<TabItem Header="Tab No. 2">
<TextBlock><Run Text="We Have Tearable Tabs!"/></TextBlock>
</TabItem>
</dragablz:TabablzControl>
-->
<ContentControl></ContentControl>
</StackPanel>

The WPF StackPanel doesn't have a border so bringing it to the front is not going to make one appear.
You would have to add your own either behind it in the same grid column or next to it by inserting a thin column and putting either a Border or Separator control in it. If putting it in the same column, you may need to adjust the StackPanel's margin so that it doesn't obscure the border.
i.e.
<Border Grid.Column="0" BorderThickness="0,0,1,0" BorderBrush="Gray"/>
<StackPanel Grid.Column="0" Margin="0,0,2,0">
<materialDesign:ColorZone Height="100" Mode="PrimaryMid">
<Border Padding="8">
<StackPanel>
<Ellipse HorizontalAlignment="Left" VerticalAlignment="Top" Width="48" Height="48" RenderTransformOrigin="-0.014,0.003" Margin="0,0,104,0">
<Ellipse.Fill>
<ImageBrush ImageSource="RandomPic.jpg" />
</Ellipse.Fill>
</Ellipse>
<TextBlock Text="UsernameX" ></TextBlock>
<TextBlock Text="EmailY" ></TextBlock>
</StackPanel>
</Border>
</materialDesign:ColorZone>
<ListBox Background="#FAFAFA" x:Name="DemoItemsListBox">
<ListBox.Items>
<TextBlock> What's going on</TextBlock>
<TextBlock>What's going on</TextBlock>
<TextBlock>What's going on</TextBlock>
<TextBlock>What's going on</TextBlock>
</ListBox.Items>
</ListBox>
</StackPanel>

Wpf withing transparent grid with opacity = "0.32" Assign Background Color/Image to Buttons and TextBox

I have a Grid with opacity = "0.32" its good working fine but now i want to add some controls like textboxes and button with some background solid color but it also gets the same opacity ration that i don't need here. Any help please?? Thanks in advance.
<Grid Margin="0,1,0,2" Grid.Row="1" Grid.Column="1"
Background="#06090b" Opacity="0.25">
<Button x:Name="btnLogin" Content="Sign in" Foreground="White"
Margin="40,264,40,0" VerticalAlignment="Top" Height="60"
Click="btnLogin_Click" FontSize="18" FontWeight="Medium"
BorderThickness="1" BorderBrush="{x:Null}" Background="Blue"
Panel.ZIndex="1">
</Button>
</Grid>

What I meant in the comment is this, you dont really need the ZIndex stuff.
you have a couple of options:
1) use an alpha color, notice background is 8 characters lenght now (first 2 are alpha, or opacity)
<Grid Margin="0,1,0,2" Grid.Row="1" Grid.Column="1"
Background="#8006090b">
<Button x:Name="btnLogin" Content="Sign in" Foreground="White"
Margin="40,264,40,0" VerticalAlignment="Top" Height="60"
Click="btnLogin_Click" FontSize="18" FontWeight="Medium"
BorderThickness="1" BorderBrush="{x:Null}" Background="Blue">
</Button>
</Grid>
2) set a opacity only to the background
<Grid Margin="0,1,0,2" Grid.Row="1" Grid.Column="1" >
<Grid.Background>
<SolidColorBrush Color="#06090b" Opacity=".25"/>
</Grid.Background>
<Button x:Name="btnLogin" Content="Sign in" Foreground="White"
Margin="40,264,40,0" VerticalAlignment="Top" Height="60"
Click="btnLogin_Click" FontSize="18" FontWeight="Medium"
BorderThickness="1" BorderBrush="{x:Null}" Background="Blue">
</Button>
</Grid>

how to acess on controls inside of stackpanel in windows phone7?

i design page bellow code.
<ScrollViewer VerticalScrollBarVisibility="Visible" Grid.Row="1" x:Name="svProduct">
<StackPanel>
<ItemsControl x:Name="lstSearchResult" ItemsSource="{Binding Path=PIProductList}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel Width="480" Style="{Binding CellStyle}" Orientation="Horizontal" VerticalAlignment="Center" Height="50" >
<TextBlock Foreground="Black" FontSize="20" Width="320" FontFamily="Tahoma" Margin="10,0,0,0" Text="{Binding Title}" VerticalAlignment="Center" TextWrapping="Wrap"></TextBlock>
<Button Name="btnBookmark" Click="btnBookmark_Click" Tag="{Binding}" Background="Transparent">
<Button.Content>
<Image Source="/Images/bookmarks_red.png" Width="33" Height="30" VerticalAlignment="Top" Margin="-15"></Image>
</Button.Content>
</Button>
<Button BorderThickness="0" x:Name="btnSubmit" Click="btnSubmit_Click" Background="Transparent" Tag="{Binding}" >
<Button.Content>
<Image Name="ram" Source="/Images/blue_arrow.png" Width="40" Height="40" VerticalAlignment="Top" Margin="-15"></Image>
</Button.Content>
</Button>
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</StackPanel>
</ScrollViewer>
i want to access for btnBookmark visuble false .
can't access btnBookmark.Visibility=Visibility.collapsed
how to do this?
please help to me...........

The best way I know to do this is to create a Visiblity property on your item ViewModel (the one that is bound to each row in your ItemsControl) and toggle that value based on the changes to each item, presumably via the toggle button in each row. I don't know of a good way to "loop and look" for these internal controls. You're much better off using the existing data binding infrastructure to manage this for you.