WPF Discussion Boards

1-Jan-13 10:44

Hi I have a winforms application I wish to convert to WPF. I have never played in xaml before so looking for a few resources to learn from. I have read a few articles here on this wonderful website and looking for more help. Any suggestions appreciated.

Thank You in advance

Frazzle the name say's it all

Always code as if the guy who ends up maintaining your code will be a violent psychopath who knows where you live.
John F. Woods

Richard MacCutchan1-Jan-13 22:31

Richard MacCutchan

1-Jan-13 22:31

One of the best WPF books[^]. Any articles by Sacha Barber[^] or Josh Smith[^].

One of these days I'm going to think of a really clever signature.

David C# Hobbyist.2-Jan-13 1:47

2-Jan-13 1:47

Thank You , I just ordered the book.

Frazzle the name say's it all

Always code as if the guy who ends up maintaining your code will be a violent psychopath who knows where you live.
John F. Woods

Pete O'Hanlon2-Jan-13 5:48

2-Jan-13 5:48

I'd second this book - in fact, have a look at the inside cover and you'll see recommendations from people like Josh, Sacha and me.

*pre-emptive celebratory nipple tassle jiggle* - Sean Ewington

"Mind bleach! Send me mind bleach!" - Nagy Vilmos

CodeStash - Online Snippet Management | My blog | MoXAML PowerToys | Mole 2010 - debugging made easier

Richard MacCutchan2-Jan-13 6:09

Richard MacCutchan

2-Jan-13 6:09

Couldn't find you in my copy; is there a hardback version?

One of these days I'm going to think of a really clever signature.

Pete O'Hanlon2-Jan-13 6:10

2-Jan-13 6:10

We're in the one for WPF 4.0.

*pre-emptive celebratory nipple tassle jiggle* - Sean Ewington

"Mind bleach! Send me mind bleach!" - Nagy Vilmos

CodeStash - Online Snippet Management | My blog | MoXAML PowerToys | Mole 2010 - debugging made easier

Abhinav S2-Jan-13 2:21

Abhinav S

2-Jan-13 2:21

You can also look at WPF Tutorial.Net[^].

WP Apps - Color Search | Arctic | XKCD | Sound Meter | Speed Dial

David C# Hobbyist.2-Jan-13 7:08

2-Jan-13 7:08

Thank you, I am checking it out now.

Frazzle the name say's it all

Always code as if the guy who ends up maintaining your code will be a violent psychopath who knows where you live.
John F. Woods

Fernando E. Braz2-Jan-13 5:15

Fernando E. Braz

2-Jan-13 5:15

i'm indebted with this other book:
Pro WPF in .NET 4 - by Matthew MacDonald (Apress)[^]
the source code for this book is also available there.

what you will get?:
.every major WPF feature
.useful source code examples (accessible enough to understand quickly)

David C# Hobbyist.2-Jan-13 7:07

WPF Tab Styling Question #2

2-Jan-13 7:07

I can only read one at a time. but Thank You. It's hard to pass up on the heavy endorsements from all the article writers here on code project.

If I still need help after reading it I will buy that one also.

Frazzle the name say's it all

Always code as if the guy who ends up maintaining your code will be a violent psychopath who knows where you live.
John F. Woods

Kevin Marois1-Jan-13 8:59

1-Jan-13 8:59

Ok, so I have my tab style working. The tabs now show the text and a close button. Here's my style:

<Style TargetType="{x:Type TabItem}">
    <Setter Property="HeaderTemplate">
        <Setter.Value>
            <DataTemplate >
                <Grid HorizontalAlignment="Stretch" Height="22">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="20" />
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="2"  ></RowDefinition>
                        <RowDefinition Height="Auto" ></RowDefinition>
                    </Grid.RowDefinitions>
                    <TextBlock Grid.Row="1" Text="{Binding RelativeSource={RelativeSource AncestorType={x:Type TabItem} }, Path=Header}"
                                VerticalAlignment="Bottom" Margin="4,0,8,0"/>
                                
                    <Button Grid.Row="1" 
                            Grid.Column="1"
                            Height="16"
                            Width="16"
                            BorderBrush="{x:Null}" Background="{x:Null}" 
                            Foreground="#FF224A71" 
                            VerticalAlignment="Center" 
                            Padding="3,0"
                            Command="{Binding CloseTabCommand}">
                                    
                        <TextBlock Text="x"
                                    VerticalAlignment="Center"
                                    HorizontalAlignment="Center"
                                    Margin="0,0,0,2"/>

                        <Button.ToolTip>
                            <controls:ToolTipEx Style="{StaticResource TooltipStyle}"
                                                HeaderText="Close"
                                                Icon="/FMG.UI.WPF;component/Media/Images/home_16.png"
                                                ContentAreaText="Closes this tab"/>


                        </Button.ToolTip>                                    
                        <Button.OpacityMask>
                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                <GradientStop Color="Black" Offset="0"/>
                                <GradientStop Color="#4BFFFFFF" Offset="1"/>
                            </LinearGradientBrush>
                        </Button.OpacityMask>
                                    
                        <i:Interaction.Triggers>
                            <i:EventTrigger EventName="Click">
                                <!--<Controls:CloseTabbedViewAction />-->
                            </i:EventTrigger>
                        </i:Interaction.Triggers>
                    </Button>
                </Grid>
            </DataTemplate>
        </Setter.Value>
    </Setter>
</Style>

You can see the button is bound to a CloseTabCommand.

When I run it, the command isn't fired. Here's the command from the VM:

private ICommand _CloseTabCommand;
public ICommand CloseTabCommand
{
    get
    {
        if (_CloseTabCommand == null)
            _CloseTabCommand = new RelayCommand(p => closeTabExecuted(), p => closeTabCanExecute());

        return _CloseTabCommand;
    }
}

What am I doing wrong?

Thanks

If it's not broken, fix it until it is

Pete O'Hanlon1-Jan-13 9:48

1-Jan-13 9:48

As this is inside a template, you aren't getting the DataContext. The easiest way to solve this is to use FindAncestor to find the TabItem that this belongs to and get the DataContext from that.

*pre-emptive celebratory nipple tassle jiggle* - Sean Ewington

"Mind bleach! Send me mind bleach!" - Nagy Vilmos

CodeStash - Online Snippet Management | My blog | MoXAML PowerToys | Mole 2010 - debugging made easier

Kevin Marois1-Jan-13 9:55

1-Jan-13 9:55

Ok, I see. I'm trying this but it's still not firing:

<Button Grid.Row="1" 
        Grid.Column="1"
        Height="16"
        Width="16"
        BorderBrush="{x:Null}" Background="{x:Null}" 
        Foreground="#FF224A71" 
        VerticalAlignment="Center" 
        Padding="3,0"
        Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Button}}, Path=CloseTabCommand}" 
        >

If it's not broken, fix it until it is

Pete O'Hanlon1-Jan-13 9:56

1-Jan-13 9:56

You need to be looking for the TabItem, not the Button as an ancestor.

*pre-emptive celebratory nipple tassle jiggle* - Sean Ewington

"Mind bleach! Send me mind bleach!" - Nagy Vilmos

CodeStash - Online Snippet Management | My blog | MoXAML PowerToys | Mole 2010 - debugging made easier

Kevin Marois1-Jan-13 10:06

1-Jan-13 10:06

Ok, so now I have this:

<Button Grid.Row="1" 
        Grid.Column="1"
        Height="16"
        Width="16"
        BorderBrush="{x:Null}" 
        Background="{x:Null}" 
        Foreground="#FF224A71" 
        VerticalAlignment="Center" 
        Padding="3,0"
        Command="{Binding RelativeSource={RelativeSource AncestorType={x:Type TabItem}}, Path=CloseTabCommand}">

It's still not workong. I have a context menu on the tab which includes Close and the command works from there, but not from this button.

If it's not broken, fix it until it is

Wayne Gaylard1-Jan-13 23:00

Wayne Gaylard

1-Jan-13 23:00

The AncestorType should be the bound to the control that is in turn bound to the VM. In most cases this is the Window/UserControl and not really the particular control in that Window, if you get what I mean.

Say you have a Window with it's DataContext set to the ViewModel that contains the CloseTabCommand, then you would do this

Command="{Binding RelativeSource={RelativeSource AncestorType={x:Type Window}}, Path=CloseTabCommand}"

.
Hope this helps

When I was a coder, we worked on algorithms. Today, we memorize APIs for countless libraries — those libraries have the algorithms - Eric Allman

Pete O'Hanlon1-Jan-13 23:08

1-Jan-13 23:08

It still doesn't know about the DataContext though. To fix this, replace it with this:

XML

<Button Grid.Row="1" 
Grid.Column="1"
Height="16"
Width="16"
BorderBrush="{x:Null}" Background="{x:Null}" 
Foreground="#FF224A71" 
VerticalAlignment="Center" 
Padding="3,0"
Command="{Binding RelativeSource={RelativeSource AncestorType={x:Type TabItem}}, Path=DataContext.CloseTabCommand}">

*pre-emptive celebratory nipple tassle jiggle* - Sean Ewington

"Mind bleach! Send me mind bleach!" - Nagy Vilmos

CodeStash - Online Snippet Management | My blog | MoXAML PowerToys | Mole 2010 - debugging made easier

Kevin Marois2-Jan-13 15:41

2-Jan-13 15:41

Thanks Pete. That did it!! +5

If it's not broken, fix it until it is

Pete O'Hanlon2-Jan-13 21:05

2-Jan-13 21:05

U am glad I could help.

*pre-emptive celebratory nipple tassle jiggle* - Sean Ewington

"Mind bleach! Send me mind bleach!" - Nagy Vilmos

CodeStash - Online Snippet Management | My blog | MoXAML PowerToys | Mole 2010 - debugging made easier

Kevin Marois2-Jan-13 21:40

WPF TabItem Styling Question

2-Jan-13 21:40

Yes I am. Learning is a team sport.

Thanks

If it's not broken, fix it until it is

Kevin Marois30-Dec-12 11:16

Re: WPF TabItem Styling Question

30-Dec-12 11:16

I'm trying to style a tab item like this[^].

So I copied this style into my view, but I don't understand how to apply this. Where/how in the TabControl XAML do I use this?

Thanks

If it's not broken, fix it until it is

Pete O'Hanlon30-Dec-12 11:40

Re: WPF TabItem Styling Question

30-Dec-12 11:40

Put it into a Resources section and drop the x:Key part to have it automatically applied to the TabItem elements.

*pre-emptive celebratory nipple tassle jiggle* - Sean Ewington

"Mind bleach! Send me mind bleach!" - Nagy Vilmos

CodeStash - Online Snippet Management | My blog | MoXAML PowerToys | Mole 2010 - debugging made easier

Kevin Marois30-Dec-12 15:16