We Keep Coding

How can one apply an itemtemplate to default TabItems?

I have the following TabControl with 2 default tabitems.
<TabControl>
<TabControl.ItemTemplate>
<DataTemplate>
<ScrollViewer VerticalScrollBarVisibility="Auto" Height="300" Content="{Binding}"/>
</DataTemplate>
</TabControl.ItemTemplate>
<TabItem Header="Conexión"><local:ConnectionSettings/></TabItem>
<TabItem Header="Cuestionario"><local:QuestionEditor/></TabItem>
</TabControl>
The current xaml doesn't apply the ItemTemplate, for that to happen each tabitem would need to be "naked", like this:
<TabControl>
<TabControl.ItemTemplate>
<DataTemplate>
<ScrollViewer VerticalScrollBarVisibility="Auto" Height="300" Content="{Binding}"/>
</DataTemplate>
</TabControl.ItemTemplate>
<!-- The ItemTemplate is only applied if tabitems are not wrapped in TabItem tags -->
<local:ConnectionSettings/>
<local:QuestionEditor/>
</TabControl>
But if I do that, then I can't specify the header.
I would like for every TabItem to be wrapped in a ScrollViewer (as specified in the ItemTemplate), but at the same be able to specify the header.
Is there a way to apply the ItemTemplate to <TabItem Header="MyHeader"/> tags?

ItemTemplate is the template to format the ItemsSource the headers on top of your tab control. ContentTemplate is the template to format the content of the tabs. To wrap your defined content to the scroll viewer, just make use of a new content control inside your template. Here is a minimal sample:
<TabControl>
<TabControl.ContentTemplate>
<DataTemplate>
<ScrollViewer>
<ContentControl Content="{TemplateBinding Property=ContentControl.Content}"/>
</ScrollViewer>
</DataTemplate>
</TabControl.ContentTemplate>
<TabItem>
<Button Content="Button1"/>
</TabItem>
<TabItem>
<Button Content="Button2"/>
</TabItem>
</TabControl>

WPF - Nested ScrollViewer

As shown in the below image I have few input fields and a DataGrid in a WPF Window.
All controls are placed inside a ScrollViewer.
Example Code:
<Window>
<ScrollViewer>
<StackPanel>
<Grid>
<Label/>
<TextBox/>
<Label/>
<TextBox/>
<Label/>
<TextBox/>
</Grid>
<DataGrid/>
</StackPanel>
</ScrollViewer>
</Window>
Requirement
1) The Datagrid should occupy all the available space in window.
2) I Want to show the ScrollViewer only if there is no room enough to accommodate Input fields.
3) I want to show the DataGrid ScrollViewer only if there is enough space to accommodate all the input filed in window but no enough space to accommodate all the columns/rows in DataGrid.
4) I want to show both ScrollViewers if there is no enough space to accommodate input fields and thecolumns/rows in datagrid.
I have tried many possible ways, But i was unable to enable ScrollViewer in DataGrid. Could any one please help me to overcome this issue.
Providing sample XAML code will be highly appreciated!.

Instead of directly adding datagrid to your main grid.Enclose your Datagrid with scrollviewer and a grid.Give that grid the size of your datagrid.
Example:-
<Window>
<ScrollViewer>
<StackPanel>
<Grid>
<Label/>
<TextBox/>
<Label/>
<TextBox/>
<Label/>
<TextBox/>
</Grid>
<Grid>
<ScrollViewer>
<DataGrid/>
</ScrollViewer>
</Grid>
</StackPanel>
</ScrollViewer>

WPF Create a slide out panel

I don't know how this works technically but my requirement is as follows. I have a DataGrid and to input data into the DataGrid, I want a panel at the bottom of the DataGrid that slides out on a button click showing input options. Except, as the panel slides out, the DataGrid has to resize vertically as well. Can someone throw some light on how I can implement this?

You should be able to use a StackPanel with 2 children, your grid and your panel. Set the initial height of your panel to 0. Once the button is clicked, set the height to whatever you need it to be (e.g., MyPanel.Height = 20). You might want to wrap the grid in a ScrollViewer in case that is needed.
<StackPanel Orientation="Vertical">
<ScrollViewer Height="Auto" VerticalAlignment="Stretch">
<Grid Height="*" VerticalAlignment="Stretch" />
</ScrollViewer>
<ContentControl x:Name="MyPanel" Height="0" />
</StackPanel>
You might need to experiment with VerticalAlignment and Height="Auto" or Height="0" to get the layout you want.

You can use Expander. Please look at the following code snippet.
<DockPanel>
<Expander DockPanel.Dock="Bottom">
<StackPanel>
<TextBlock Height="25"></TextBlock>
<TextBlock Height="25"></TextBlock>
<TextBlock Height="25"></TextBlock>
</StackPanel>
</Expander>
<Border BorderBrush="LightGreen" BorderThickness="2">
<DataGrid/>
</Border>
</DockPanel >

Extended WPF Toolkit RichTextBox HorizontalScrollBarVisibility issue

when I am loading a text file to my window I am not getting horizontal ScrollBar at all any idea why ?
<UserControl x:Class="CAMXSimulator.View.LogView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:toolkit="clr-namespace:Microsoft.Windows.Controls;assembly=WPFToolkit.Extended">
<TabControl
AllowDrop="True"
PreviewDragOver="DragOver"
PreviewDrop="Drop"
>
<TabItem Header=" File">
<toolkit:RichTextBox AcceptsReturn="True"
AcceptsTab="True"
BorderBrush="Black"
BorderThickness="2"
ScrollViewer.HorizontalScrollBarVisibility="Auto"
Name="DisplaySFMFileContents"
Text="{Binding Path=VManageLogFile}"
ScrollViewer.VerticalScrollBarVisibility="Auto"
>
<toolkit:RichTextBox.TextFormatter>
<toolkit:PlainTextFormatter />
</toolkit:RichTextBox.TextFormatter>
</toolkit:RichTextBox>
</TabItem>
<TabItem Header=" Headers" />
</TabControl>
</UserControl>
It just formats the lines to be as width of the window and not how they should be .
Any idea ?

You need to set the WordWrap = False in order for this to work properly. Otherwise it will wrap the text and only show the Vertical scrollbar if needed.
In looking over the code in my text project, it looks like the WordWrap keyword might not be there. However, to enable this functionality, you can set the Document.PageWidth = and it will prevent the text from wrapping.

How can I add extra content to a WPF TabControl? [duplicate]

This question already has answers here:
WPF: template or UserControl with 2 (or more!) ContentPresenters to present content in 'slots'
(3 answers)
Closed 3 years ago.
I have a custom ControlTemplate for a WPF TabControl that adds Buttons to the left and right hand side of the TabItem header. At the moment this is not a named part as the button commands are bound in the ControlTemplates XAML and do not need to be exposed outside of the ControlTemplate.
This works fine for a button but what if I want to add content to the left (or right) hand side of the TabItemHeaders which can be bound outside of the ControlTemplate so that my TabControl becomes more flexible?
My idea was to subclass the TabControl and have two named parts in the ControlTemplate and expose these as properties of the new control; CustomTabControl.LeftContentArea and CustomTabControl.RightContentArea respectively. Each named part is a ContentPresenter and each ContentPresenters Content property is exposed by the properties named above.
However, when I tried this I was unable to put content into the left and right content areas.
Edit: Just to be clear I have included an image. The red rectangles show where I want to be able to place extra content.
Update: Below is a screen shot of the progress I have made so far, hopefully this will help explain my problem a bit more.
The screen shot shows my custom Tab Control with two blank tabs and three buttons that are currently on the right hand side of the TabItem header area. The buttons are currently defined in the TabControls custom ControlTemplate I.E. there is a ColumnDefinition within the ControlTemplates Grid which contains a StackPanel that hosts 3 buttons.
What I am looking for is a way to allow the consumer of the tab control decide what content goes in the area next to the tabs. E.G. the user should be able to do something like this:
<local:CustomTabControl>
<local:CustomTabControl.RightContentArea>
<!-- This can be changed to ANY content that the user wants -->
<StackPanel Orientation="Horizontal">
<Button Content="Test" />
<Button Content="Test" />
<Button Content="Test" />
</StackPanel>
</local:CustomTabControl.RightContentArea>
<!-- TabItems are added as normal -->
<TabItem Header="Tab One" />
<TabItem Header="Tab Two" />
</local:CustomTabControl>

I tried a different (lazy) way, which was to create another grid that occupies the same space as the TabControl, ie both are in Grid.Row=0. I have bound the grid height to the height of the first tab so if the tabs change height the other controls will remain centered. I set MinWidth on the window so the controls dont overlap the tabs.
Paste this code into a new WPF Window...
<Window x:Class="MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Title="MainWindow" Height="306" Width="490" MinWidth="300">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<TabControl Grid.Row="0" x:Name="tabControl">
<TabItem x:Name="tabItem" Header="TabItem" Height="50">
<Grid Background="#FFE5E5E5"/>
</TabItem>
<TabItem Header="TabItem">
<Grid Background="#FFE5E5E5"/>
</TabItem>
</TabControl>
<Grid Grid.Row="0" Height="{Binding ActualHeight, ElementName=tabItem}"
VerticalAlignment="Top" Margin="0,2,0,0">
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right"
VerticalAlignment="Center" Margin="20,0">
<TextBlock VerticalAlignment="Center" Margin="10,0" FontSize="16"
Foreground="Red" FontFamily="Calibri">My Text</TextBlock>
<Button Content="My Button" />
</StackPanel>
</Grid>
</Grid>
</Window>
...and you will get this:

Depending on how much flexibility you need there are some methods that are suited better than others, i myself try to use DynamicResources if possible because it is normally less troublesome than creating new user-controls.
Here's an example of how to add additional content to the left of the Tab-Header:
<TabControl>
<TabControl.Resources>
<DataTemplate x:Key="AugmentedTabItem">
<StackPanel Orientation="Horizontal">
<ContentPresenter Content="{DynamicResource ContentLeft}" Margin="0,0,5,0"/>
<ContentPresenter Content="{Binding}"/>
</StackPanel>
</DataTemplate>
</TabControl.Resources>
<TabItem Header="ÜberTab" HeaderTemplate="{StaticResource AugmentedTabItem}">
<TabItem.Resources>
<TextBlock x:Key="ContentLeft" Text=">>>" Foreground="Blue"/>
</TabItem.Resources>
</TabItem>
</TabControl>
Hope that helps, if something is unclear or if this doesn't suffice, drop a comment.