I have a XAML code like this:
<Grid x:Name="LayoutRoot">
<TabControl Margin="0,53,0,0">
<TabItem Header="First">
<Grid Background="#FFE5E5E5">
<TextBlock />
</Grid>
</TabItem>
<TabItem Header="Second" >
<Grid Background="#FFE5E5E5">
<TextBlock />
</Grid>
</TabItem>
<TabItem Header="Third">
<Grid Background="#FFE5E5E5">
<TextBlock />
</Grid>
</TabItem>
</TabControl>
<Button Content="Button" HorizontalAlignment="Right" Margin="0,8,174,0" VerticalAlignment="Top" Width="75"/>
<TextBox Height="20.96" Margin="30,9,267,0" TextWrapping="Wrap" Text="TextBox" VerticalAlignment="Top"/>
</Grid>
Using C# in every tabitem there is one textblock
if I type something in textbox, and after that I click the button, and now selected TabItem is "third"
Please help me how to change the textblock in that Selected TabItem now?
yeah the textbox and button outside from tab.
Here it is:
<Grid x:Name="LayoutRoot">
<TabControl Margin="0,53,0,0" Name="tabControl">
<TabItem Header="First">
<Grid Background="#FFE5E5E5">
<TextBlock />
</Grid>
</TabItem>
<TabItem Header="Second" >
<Grid Background="#FFE5E5E5">
<TextBlock />
</Grid>
</TabItem>
<TabItem Header="Third">
<Grid Background="#FFE5E5E5">
<TextBlock />
</Grid>
</TabItem>
</TabControl>
<Button Content="Button" HorizontalAlignment="Right" Margin="0,8,174,0" VerticalAlignment="Top" Width="75" Click="Button_Click"/>
<TextBox Height="20.96" Margin="30,9,267,0" TextWrapping="Wrap" Text="TextBox" VerticalAlignment="Top" Name="textBox"/>
</Grid>
Backing code:
private void Button_Click(object sender, RoutedEventArgs e)
{
var match = tabControl.Items.OfType<TabItem>().Where(tab => tab.Header.ToString() == textBox.Text).FirstOrDefault();
if (match != null) match.IsSelected = true;
}
Hope I get you right
Update
Looks like I didn't understand you from the first time. Here's right backing code for your case:
private void Button_Click(object sender, RoutedEventArgs e)
{
tabControl.Items.OfType<TabItem>().Where(tab => tab.IsSelected == true).First().Header = textBox.Text;
}
Related
I have a User Control with height Height="500" that Will have a TabControl with some items, I want to assign 320 to be the height of TabControl, However I am using others UserControls as Content for TabControl, those controls have height assigned as DesignHeight="320"
<UserControl x:Class="GUI.ProcessManager"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
xmlns:local="clr-namespace:GUI"
mc:Ignorable="d" Width="705" Height="500">
<Grid>
<TabControl Margin="0">
<TabItem Header="Tab 1">
<local:otherUserControl />
</TabItem>
<TabItem Header="Tab 2">
<local:otherUserControl2 />
</TabItem>
</TabControl>
<telerik:RadButton Content="Ok" Height="22" HorizontalAlignment="Left" Margin="25,450,0,0" Name="BtnOk" VerticalAlignment="Top" Width="135" Click="BtnOk_Click" />
<telerik:RadButton Content="Cancel" Height="22" HorizontalAlignment="Left" Margin="545,450,0,0" Name="BtnCancel" VerticalAlignment="Top" Width="90" Click="BtnCancel_Click"/>
</Grid >
</UserControl>
I want to give the TabControl a size of 320 and after that I want to put Ok and Cancel buttons, so they wont change position when user selects tabs
To do so I added a grid row definition
<Grid.RowDefinitions>
<RowDefinition Height="320"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
And assigned row 0 to TabControl:
<TabControl Grid.Row="0" Margin="0">
...
</TabControl>
Then assigned row 1 to Buttons:
<telerik:RadButton Grid.Row="1" Content="Ok" Height="22" HorizontalAlignment="Left" Margin="25,450,0,0" Name="BtnOk" VerticalAlignment="Top" Width="135" Click="BtnOk_Click" />
But I am only getting the window with The tab and then a blank space but without buttons are dissappering, Why is this happening or what am I missing
How to fix the size of TabControl so I can put buttons after that fixed size?
Use a DockPanel:
<DockPanel>
<TabControl DockPanel.Dock="Top" Margin="0" Height="320">
<TabItem Header="Tab 1">
<local:otherUserControl />
</TabItem>
<TabItem Header="Tab 2">
<local:otherUserControl2 />
</TabItem>
</TabControl>
<StackPanel Orientation="Horizontal" DockPanel.Dock="Bottom" Margin="2,5">
<telerik:RadButton Content="Ok" Name="BtnOk" Click="BtnOk_Click" />
<telerik:RadButton Content="Cancel" Name="BtnCancel" Click="BtnCancel_Click"/>
</StackPanel>
</DockPanel>
The whole example would also be possible with using a Grid but it is necessary to remove the Margin from the Buttons.
I know normally we can use this codes to bind Selected Tab Header Text and show selected tab:
<TabControl Name="MyTabControl">
<TabItem Header="Tab1"/>
<TabItem Header="Tab2" />
</TabControl>
<Lable Content="{Binding ElementName=MyTabControl, Path=SelectedItem.Header}"/>
But how can i bind when i have this codes:
<TabControl Name="MyTabControl">
<TabItem>
<TabItem.Header>
<StackPanel Orientation="Horizontal">
<Image Source="/Images/a.png" />
<TextBlock Text="Tab1" />
</StackPanel>
</TabItem.Header>
</TabItem>
<TabItem>
<TabItem.Header>
<StackPanel Orientation="Horizontal">
<Image Source="/Images/b.png" />
<TextBlock Text="Tab2" />
</StackPanel>
</TabItem.Header>
</TabItem>
<Lable Content="{Binding ??????????? "/>
Instead of assigning direct content to header you can make use of HeaderTemplate.
Refer below code.
<TabControl Name="MyTabControl">
<TabItem Header="Tab1">
<TabItem.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Image Source="/Images/a.png" />
<TextBlock Text="{Binding}"/>
</StackPanel>
</DataTemplate>
</TabItem.HeaderTemplate>
</TabItem>
<TabItem Header="Tab2">
<TabItem.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Image Source="/Images/b.png" />
<TextBlock Text="{Binding}"/>
</StackPanel>
</DataTemplate>
</TabItem.HeaderTemplate>
</TabItem>
</TabControl>
<Label Content="{Binding ElementName=MyTabControl, Path=SelectedItem.Header}"/>
I have a button which has a ToolTip attached to it.
There are data-bound information inside the ToolTip.
I am displaying the ToolTip on click as well as on MouseOver.
By using the code:
private void Button_Click(object sender, RoutedEventArgs e)
{
Button btn = sender as Button;
tt = btn.ToolTip as ToolTip;
tt.IsOpen = true;
}
If I click the button, the ToolTip is displayed, but without the data-values.
But if I hover the mouse over the button, it displays correctly.
Important
If I hover over it first, get the tooltip, take the mouse away and then come again and click, it displays correctly.
So I'm guessing that I need to do some kind of call for the tooltip to get the databound info when I call the tt.IsOpen = true
How can I achieve the complete display of tooltip by manually calling it?
Thanks in advance.
Update
The xaml code.
<Button Content="{x:Static prop:strings.Info}" Margin="2" HorizontalAlignment="Center" Click="Button_Click" >
<Button.ToolTip>
<ToolTip>
<ToolTip.Template>
<ControlTemplate TargetType="ToolTip">
<Border BorderBrush="Blue" BorderThickness="1" Background="White" CornerRadius="5">
<StackPanel Orientation="Vertical">
<DockPanel>
<TextBlock Text="{x:Static prop:strings.Laenge}" Margin="10" DockPanel.Dock="Left"/>
<TextBlock Text="{Binding LaengeD}" Margin="10" DockPanel.Dock="Right" />
</DockPanel>
<DockPanel >
<TextBlock Text="{x:Static prop:strings.Breite}" Margin="10" DockPanel.Dock="Left"/>
<TextBlock Text="{Binding BreiteD}" Margin="10" DockPanel.Dock="Right"/>
</DockPanel>
<DockPanel>
<TextBlock Text="{x:Static prop:strings.Hoehe}" Margin="10" DockPanel.Dock="Left"/>
<TextBlock Text="{Binding HoeheD}" Margin="10" DockPanel.Dock="Right"/>
</DockPanel>
<DockPanel>
<TextBlock Text="{x:Static prop:strings.Gewicht}" Margin="10" DockPanel.Dock="Left"/>
<TextBlock Text="{Binding Gewicht}" Margin="10" DockPanel.Dock="Right"/>
</DockPanel>
</StackPanel>
</Border>
</ControlTemplate>
</ToolTip.Template>
</ToolTip>
</Button.ToolTip>
</Button>
When your Tooltip is hidden, its PlacementTarget property is set to null and it is not linked to the logic tree of your button.
In this case your {Binding LaengeD} can't retrieve the correct value.
On the other side if you hover the button the PlacementTarget property is correctly set and your Binding can work.
So you can use this solution: add a DataContext binding to your tooltip
<Button Content="Click me" Margin="2" HorizontalAlignment="Center" Click="Button_Click" >
<Button.ToolTip>
<ToolTip DataContext="{Binding Path=PlacementTarget.DataContext, RelativeSource={x:Static RelativeSource.Self}}">
<ToolTip.Template>
<ControlTemplate TargetType="ToolTip">
<Border BorderBrush="Blue" BorderThickness="1" Background="White" CornerRadius="5">
<StackPanel Orientation="Vertical">
<DockPanel>
<TextBlock Text="Laenge" Margin="10" DockPanel.Dock="Left"/>
<TextBlock Text="{Binding LaengeD}" Margin="10" DockPanel.Dock="Right" />
</DockPanel>
</StackPanel>
</Border>
</ControlTemplate>
</ToolTip.Template>
</ToolTip>
</Button.ToolTip>
</Button>
Then change your click event handler in this way:
private void Button_Click(object sender, RoutedEventArgs e)
{
Button btn = sender as Button;
ToolTip tt = btn.ToolTip as ToolTip;
if (tt.PlacementTarget == null)
{
tt.PlacementTarget = btn;
}
tt.IsOpen = true;
}
I dynamically want to add panorama items in my application. No. of item(3 to 7) is depend on the json response I am getting. Presently for testing I created 4 items in xaml and it works for me but its not dynamic. Here is my xaml.
<Grid x:Name="LayoutRoot">
<controls:Panorama Title="my panorama" Loaded="Panorama_Loaded" Name="title1" ItemsSource="{Binding}">
<controls:Panorama.Background>
<ImageBrush ImageSource="/Images/Panaroma_BG.png"/>
</controls:Panorama.Background>
<!--Panorama item one-->
<controls:PanoramaItem Header="item1" Name="dashboard1" HeaderTemplate="{StaticResource DashBoardName}">
<Grid>
<ListBox Height="512" HorizontalAlignment="Left" Margin="6,8,0,0" Name="listBox1" VerticalAlignment="Top" Width="403" Tap="listBox1_Tap">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Rectangle Height="100" Width="400" HorizontalAlignment="Left" Name="rectangle1" Stroke="Black" StrokeThickness="1" VerticalAlignment="Top"/>
<StackPanel Orientation="Horizontal">
<Image Width="100" Height="100" Source="{Binding Image}" Stretch="Fill" HorizontalAlignment="Left" VerticalAlignment="Top" />
<StackPanel Orientation="Horizontal"
Height="132">
<StackPanel Width="300" HorizontalAlignment="Left">
<Grid>
<TextBlock Text="{Binding CurrentValue}" HorizontalAlignment="Left" FontSize="25" />
<Image Width="20" Height="20" Source="{Binding SubImage}" Stretch="Fill" HorizontalAlignment="Right" VerticalAlignment="Bottom"/>
<TextBlock Text="{Binding PreviousValue}" HorizontalAlignment="Right" VerticalAlignment="Top" FontSize="15" />
</Grid>
<StackPanel Width="290" HorizontalAlignment="Right" VerticalAlignment="Stretch" Orientation="Vertical">
<TextBlock Text="{Binding ItemName}" FontSize="20" TextWrapping="Wrap" Width="290" HorizontalAlignment="Left" VerticalAlignment="Bottom"/>
</StackPanel>
</StackPanel>
</StackPanel>
</StackPanel>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</controls:PanoramaItem>
<!--Panorama item two-->
<!--Panorama item three-->
<!--.................-->
</controls:Panorama>
</Grid>
I don't want to write xaml for Panorama item two, Panorama item three and so on I think there must be some way to do it at runtime. Please help me out.
There must be some template like thing which I can use. and then fill the inner items like CurrentValue , ItemName etc. through code
I have tested below code for pivot. You can implement similar for Panaroma
Dim objPivotItem As PivotItem
Dim sScrollViewer As ScrollViewer
Dim sStackPanel As StackPanel
Dim textHeader As TextBlock
Dim txtContents As RichTextBox
For i = 0 to <Condition>
objPivotItem = New PivotItem
sStackPanel = New StackPanel
sScrollViewer = New ScrollViewer
textHeader = New TextBlock
txtContents = New RichTextBox
'Set TextHeader properties
'Set TxtContents properties
objPivotItem.Content = sScrollViewer
sScrollViewer.Content = sStackPanel
sStackPanel.Children.Add(textHeader)
sStackPanel.Children.Add(txtContents)
objPivot.Items.Add(objPivotItem
)
Next i
You actually can set an ItemsSource property for the whole panorama control, e. g.:
<phone:Panorama x:Name="MyPanorama">
<phone:Panorama.ItemTemplate>
<DataTemplate>
<phone:PanoramaItem Header="MyHeader">
<TextBlock Text="{Binding Text}"/>
</phone:PanoramaItem>
</DataTemplate>
</phone:Panorama.ItemTemplate>
<phone:Panorama.HeaderTemplate>
<DataTemplate>
<TextBlock Visibility="Collapsed" />
</DataTemplate>
</phone:Panorama.HeaderTemplate>
</phone:Panorama>
and then, for example from the code behind:
MyPanorama.ItemsSource = myItemsCollection;
Hi i have a xaml code like this
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="test.Window1"
x:Name="Window"
Title="Window1"
Width="640" Height="480">
<Grid x:Name="LayoutRoot">
<Button Content="Create a tab" HorizontalAlignment="Left" Margin="49,26,0,0" VerticalAlignment="Top" Width="75"/>
<TabControl Margin="0,63,0,0">
</TabControl>
</Grid>
</Window>
in TabControl no tabItem there.
please helpe me, how to program with c# :
if i click the button, it will add a tab item with grid and a textblock in that. the result i wish like this :
<Grid x:Name="LayoutRoot">
<Button Content="Create a tab" HorizontalAlignment="Left" Margin="49,26,0,0" VerticalAlignment="Top" Width="75"/>
<TabControl Margin="0,63,0,0">
<TabItem Header="tab1">
<Grid>
<TextBlock Text="hi there" />
</Grid>
</TabItem>
</TabControl>
</Grid>
and if i click more that button, will continue add tab like that.
please help me (worship)
Given that this is your xaml:
<Grid x:Name="LayoutRoot">
<Button Content="Create a tab" HorizontalAlignment="Left" Margin="49,26,0,0" VerticalAlignment="Top" Width="75"/>
<TabControl Margin="0,63,0,0" x:Name="MyTabControl">
<TabItem Header="tab1">
<Grid>
<TextBlock Text="hi there" />
</Grid>
</TabItem>
</TabControl>
</Grid>
you can add tabitem in codebehind like so:
TextBlock t = new TextBlock { Text= "hi" };
Grid g = new Grid;
g.Children.Add(t);
TabItem t = new TabItem();
t.Content = g;
MyTabControl.Children.Add(t);