13 Replies - 1562 Views - Last Post: 28 January 2013 - 08:24 AM Rate Topic: -----

#1 KFredje  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 131
  • Joined: 06-September 11

Drawing on MouseEnter, Invalidate on MouseLeave

Posted 24 January 2013 - 10:21 AM

So, I'm having a problem. I have a PictureBox and a Label next to each other without a pixel space between them. Now, I call the following code for both the PictureBox and the Label.
p.MouseEnter += (s, ex) => { hover(panel, p, l); };
p.MouseLeave += (s, ex) => { panel.Invalidate(); p.Invalidate(); l.Invalidate(); };

l.MouseEnter += (s, ex) => { hover(panel, p, l); };
l.MouseLeave += (s, ex) => { panel.Invalidate(); p.Invalidate(); l.Invalidate(); };

void hover(Panel panel, PictureBox p, Label l)
        {
            int width = panel.Width - 1;
            int height = panel.Height - 1;
            Pen myPen = new Pen(Color.Red);
            Graphics PanelGraphics = panel.CreateGraphics();
            Graphics PictureGraphics = p.CreateGraphics();
            Graphics LabelGraphics = l.CreateGraphics();

            PanelGraphics.DrawLine(myPen, 0, 0, width, 0);
            PanelGraphics.DrawLine(myPen, 0, 0, 0, height);
            PanelGraphics.DrawLine(myPen, width, 0, width, height);
            PanelGraphics.DrawLine(myPen, 0, height, width, height);

            PictureGraphics.DrawLine(myPen, 0, 0, 0, height);
            PictureGraphics.DrawLine(myPen, width, 0, width, height);
            PictureGraphics.DrawLine(myPen, 0, 0, width, 0);

            LabelGraphics.DrawLine(myPen, 0, 0, 0, height);
            LabelGraphics.DrawLine(myPen, width, 0, width, height);

            myPen.Dispose();
            PanelGraphics.Dispose();
            PictureGraphics.Dispose();
            LabelGraphics.Dispose();
        }

So if I enter the PictureBox from the Form and leave it to the Form my code works as intended, drawing the lines on enter, removing them on leaving.

When I go from the PictureBox to the Label or vice versa, the lines got removed but not drawn again. So I guess when i leave the PictureBox and enter the Label the lines get drawn but immediately removed.

Is This A Good Question/Topic? 0
  • +

Replies To: Drawing on MouseEnter, Invalidate on MouseLeave

#2 tlhIn`toq  Icon User is offline

  • Please show what you have already tried when asking a question.
  • member icon

Reputation: 5529
  • View blog
  • Posts: 11,843
  • Joined: 02-June 10

Re: Drawing on MouseEnter, Invalidate on MouseLeave

Posted 24 January 2013 - 01:09 PM

Have you accounted for the fact that both methods get called if you leave the label and enter the picturebox?

l.MouseLeave
-and-
p.MouseEnter

The both invalidate the panel. So I suspect they are fighting each other and un-doing the work of the other.

I'm not sure I see your logic that when you have label.Leave you invalidate the panel.

If you are trying to have the two controls behave as one, then make them one. Put them both on a UserControl. Then work with the UserControl.MouseEnter and UserControl.MouseLeave to paint or unpaint both controls together.

If you're trying to do something else I'm lost as to what it is. Pictures would help.
Was This Post Helpful? 0
  • +
  • -

#3 tlhIn`toq  Icon User is offline

  • Please show what you have already tried when asking a question.
  • member icon

Reputation: 5529
  • View blog
  • Posts: 11,843
  • Joined: 02-June 10

Re: Drawing on MouseEnter, Invalidate on MouseLeave

Posted 24 January 2013 - 01:16 PM

Invalidating the panel *should* have a cascading effect to repaint the child controls as well. So when you:
  • invalidate label
  • invalidate picturebox
  • invalidate panel

I'm pretty sure you're repainting the label and the picturebox twice.
Was This Post Helpful? 0
  • +
  • -

#4 KFredje  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 131
  • Joined: 06-September 11

Re: Drawing on MouseEnter, Invalidate on MouseLeave

Posted 25 January 2013 - 01:22 PM

Well, I have a PictureBox and a Label together in a Panel. I want to paint a border when hovering the panel like making a button that's also clickable with the visual effects that I try to create but fail to do. Can you maybe lead me to a solution?

View PosttlhIn`toq, on 24 January 2013 - 01:16 PM, said:

I'm pretty sure you're repainting the label and the picturebox twice.
If I remove the p.Invalidate(); l.Invalidate(); and leave panel.Invalidate(); the PictureBox and the Label don't get repainted.

This post has been edited by KFredje: 25 January 2013 - 01:22 PM

Was This Post Helpful? 0
  • +
  • -

#5 tlhIn`toq  Icon User is offline

  • Please show what you have already tried when asking a question.
  • member icon

Reputation: 5529
  • View blog
  • Posts: 11,843
  • Joined: 02-June 10

Re: Drawing on MouseEnter, Invalidate on MouseLeave

Posted 25 January 2013 - 01:44 PM

View PostKFredje, on 25 January 2013 - 02:22 PM, said:

Well, I have a PictureBox and a Label together in a Panel. I want to paint a border when hovering the panel


Then what the heck are you doing dicking around with the PictureBox and Label mouse events?
You said it yourself, you want to draw a border when hovering on the panel. Then make event handlers for when you are hovering on the panel.

Below is 10 seconds of confirming that the panel does in deed have these events.

        void Testing()
        {
            Panel p = new Panel();
            p.MouseHover += p_MouseHover;
            p.MouseEnter += p_MouseEnter;
            p.MouseLeave += p_MouseLeave;
        }

        void p_MouseLeave(object sender, EventArgs e)
        {
            throw new NotImplementedException();
        }

        void p_MouseEnter(object sender, EventArgs e)
        {
            throw new NotImplementedException();
        }

        void p_MouseHover(object sender, EventArgs e)
        {
            throw new NotImplementedException();
        }




Quote

Can you maybe lead me to a solution?

I tried to lead you to a solution: I suggested you make a UserControl for this. All the behavior for this group of controls should be in the group of controls. It should not be the main application code micro-managing its children.

I don't think you you need someone writing the solution for you. I think you need to get some sleep. When you get up start a completely new project so you don't have any of the bad crap from this project to contend with. Then stop and think before you start typing. It isn't really a tough connection to make that if you want something to happen when you hover on a Panel then you need to subscribe to the Panel events.

Though, personally if you are going to invest all this time in making cool effects for a snazzy looking program then you should drop doing this in yesterdays WinForms and spend your time learning WPF. Presentation is literally the middle name of WPF. Its built to present a good presentation to the user. You could create a XAML template that defines how all Panels should look, that would include behavior for mouse enter and leave and have that template apply to the entire program. If you want to change the look from blue to red you just change it in the template and you're done. Its like web CCS style sheets, for your desktop application.
Was This Post Helpful? 1
  • +
  • -

#6 KFredje  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 131
  • Joined: 06-September 11

Re: Drawing on MouseEnter, Invalidate on MouseLeave

Posted 26 January 2013 - 07:27 AM

So I started over with WPF and I'm trying to create my own UserControl now but I hit a snag. So far I have a TextBox and Image control in my UserControl.

For my TextBox I set and get the Text in it by this code:
#Button.xaml.cs
public string Title
        {
            get { return TextBlockTitle.Text; }
            set { TextBlockTitle.Text = value; }
        }

#Mainwindow.xaml.cs
 private void button1_Click(object sender, RoutedEventArgs e)
        {
            M1.Title = "lol";
        } 
This works like a charm.

Now, I want to add an image by a weburl to this Image control in my UserControl. This is what I have so far:
#Button.xaml
<Grid>
        <Image x:Name="ImagePoster" Source="{Binding Poster}" Height="150" VerticalAlignment="Top"/>
        <TextBlock x:Name="TextBlockTitle" HorizontalAlignment="Left" Margin="0,150,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="100" MaxWidth="100" MinWidth="100" TextAlignment="Center"/>
        <Border BorderBrush="Black" BorderThickness="1"/>
    </Grid>

#Button.xaml.cs
public string MoviePoster
        {
            get { }
            set { }
        } 
I want to be able to do the same like with the TextBlock setting it's text by the property I made in my UserControl but here I fail. I have no clue how I can set or get the Image Source. I did search the internet but I don't find how I can do it with an property like in C# would be:
PictureBox p = new PictureBox();
p.Load(@"http://www.marionnap.nl/images/stories/interview/bla-bla.jpg");

Was This Post Helpful? 0
  • +
  • -

#7 tlhIn`toq  Icon User is offline

  • Please show what you have already tried when asking a question.
  • member icon

Reputation: 5529
  • View blog
  • Posts: 11,843
  • Joined: 02-June 10

Re: Drawing on MouseEnter, Invalidate on MouseLeave

Posted 26 January 2013 - 08:50 AM

Stop. I'm thrilled to see you move to WPF! There is going to be a bit of a learning curve so don't let that discourage you. The results are so very much worth it.

But in doing so you need to update your methods of doing things to the way WPF works. You *can* set and get text like you've shown, but it is not the accepted way. WPF is all about binding to properties. Normally a textbox.text is bound to a property in the code behind. That way it updates in real time as the property changes, or the property updates as the GUI changes without having to subscribe to .TextChanged events and so on.

Wait... COme to think of it I just went through this in another thread


View PosttlhIn`toq, on 24 January 2013 - 06:50 PM, said:

yeah - you're missing a lot of understanding about properties and WPF foundation concepts.

Your rentList isn't a property, its a field.
It needs to be a property that impliments the INotifyPropertyChanged event. WPF uses that event to know when the property value has been changed.

Next, WPF utilizes a concept of Data Context to locate properties. If you are using a property within the same class then you can set the XAML in the window to use itself as the data context. In other cases you might use a model, or another class etc. as the context for the data.

Properties and events are foundation concepts for C# regardless of WinForms or WPF. Tutorials for these are linked in my signature block as part of the C# learning series.

Data context is a foundation concept for WPF. Since you you don't appear to be familiar with any of that I would suggest you work your way through a C# book and a WPF book just doing the exercises and learning these concepts. Then go back to trying to trying to design your program. But until you have a better understanding of these things you're just flailing in the dark hoping you hit something that works by accident.

Quickie example:

XAML
Line 5 - See how we set the datacontext
Line 13 - See how we bind to the property in the code behind
<window
   <!--  All the xmlns: tags -->
   Height="500"
   Width="800"
   DataContext="{Binding RelativeSource={RelativeSource Self}}"
   <!-- blah blah -->
   >

            <StatusBarItem DockPanel.Dock="Left">
                <TextBlock x:Name="tbkStatus"
                           Width="Auto"
                           MinWidth="150"
                           Text="{Binding Path=StatusText,
                                          Mode=OneWay}"
                           />
            </StatusBarItem>

    
</Window>




C# code behind
Line 1 - We use the interface INotifyPropertyChange
Line 3 - We make the PropertyChanged event
Line 16 - The method we use throughout the class to raise that event
line 5 - The property the textblock in the Window is binded to.
Line 11 - We call the method to raise the event when the property value is set
Line 10 - I like to time-stamp all my status messages so I can see changes even if 3 statuses in a row are the same text. Rather than do this formatting in lots of places we do it in the property so all we have to do is send the status "Completed" IE
12:14:15.20 - Completed
12:20:10.05 - Completed
12:30:58.45 - Completed

    public class MyWindow : Window, INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        public string StatusText
        {
            get { return _status; }
            set
            {
                _status = DateTime.Now.ToString("HH:mm:ss- ") + value;
                NotifyPropertyChanged("StatusText");
            }



        protected void NotifyPropertyChanged(String info)
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(info));
            }
        }
    }




I'm quickly realizing I should do a "Shifting from WinForms to WPF" tutorial.

The important thing to notice with the binding is that the code behind doesn't specifically mention the textblock in the GUI. It just raises an event saying the value of the property has changed. Any subscriber can then do whatever they need to do with that information.

The GUI will update the textblock.
Your logging class might also add this change in status to the log file.
A separate pallet of on-going history might also show it.
etc. etc. etc. all without ever explicitly adding to the get and set of the property.

This is why we love events and try to use them as much as possible, along with the idea of not tightly coupling code to GUI.
Was This Post Helpful? 1
  • +
  • -

#8 KFredje  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 131
  • Joined: 06-September 11

Re: Drawing on MouseEnter, Invalidate on MouseLeave

Posted 26 January 2013 - 11:05 AM

So I implemented your bit of code in my main window and tested it and I got it to work. Now I want to implement it in my usercontrol or am I going to fast? Got this:
#MyButton.xaml
<UserControl x:Class="_List.Button"
             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" 
             mc:Ignorable="d" Height="200" Width="100
             ">
    <Grid>
        <Image x:Name="ImagePoster" Source="{Binding Poster}" Height="150" VerticalAlignment="Top"/>
        <TextBlock x:Name="tbkTitle" 
                   HorizontalAlignment="Left" 
                   Margin="0,150,0,0" 
                   TextWrapping="Wrap" 
                   VerticalAlignment="Top" 
                   Width="100" MaxWidth="100" MinWidth="100" 
                   TextAlignment="Center" 
                   Text="{Binding Path=Title,Mode=OneWay}"
                   />
        <Border BorderBrush="Black" BorderThickness="1"/>

    </Grid>
</UserControl>

#MyButton.xaml.cs
public partial class Button : UserControl, INotifyPropertyChanged
    {
        #region Local variables
        private string _Title = "";
        #endregion

        #region Public properties
        public event PropertyChangedEventHandler PropertyChanged;

        protected void NotifyPropertyChanged(String info)
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(info));
            }
        }

        public string Title
        {
            get { return _Title; }
            set
            {
                _Title = value;
                NotifyPropertyChanged("Title");
            }
        }
        #endregion

#Mainwindow.xaml
<local:MyButton HorizontalAlignment="Left" Margin="154,47,0,0" VerticalAlignment="Top"/>

Now, I'm a bit confused really. How can I set the text in the TextBlock inside my control? Do I have to it the same like the TextBlock in my MainWindow or is there and easier way cause it does a bit complicated to me.

This post has been edited by KFredje: 26 January 2013 - 11:23 AM

Was This Post Helpful? 0
  • +
  • -

#9 tlhIn`toq  Icon User is offline

  • Please show what you have already tried when asking a question.
  • member icon

Reputation: 5529
  • View blog
  • Posts: 11,843
  • Joined: 02-June 10

Re: Drawing on MouseEnter, Invalidate on MouseLeave

Posted 26 January 2013 - 11:55 AM

Quote

Do I have to it the same like the TextBlock in my MainWindow or is there and easier way cause it does a bit complicated to me.


No offense, but that sentence makes my brain hurt. Is English not your native language? Don't worry, your English is still 100 times better than my attempts to learn Russian!


11        <TextBlock x:Name="tbkTitle"
12                   HorizontalAlignment="Left"
13                   Margin="0,150,0,0"
14                   TextWrapping="Wrap"
15                   VerticalAlignment="Top"
16                   Width="100" MaxWidth="100" MinWidth="100"
17                   TextAlignment="Center"
18                   Text="{Binding Path=Title,Mode=OneWay}"
19                   />



Line 18: You bind the text of the Textblock to the string property "Title". (This is correct. Good job)

Therefore, to change the text in the textblock you change the property. Set "Title" to a new value. But you should change the mode to TwoWay. That way changing the GUI changes the property, and changing the property changes the GUI.
Was This Post Helpful? 0
  • +
  • -

#10 KFredje  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 131
  • Joined: 06-September 11

Re: Drawing on MouseEnter, Invalidate on MouseLeave

Posted 26 January 2013 - 02:48 PM

Well, that sentence has to been written at a weak moment cause my English is better than that although it ain't my native language.

The ultimate thing I want to do is dynamically add my usercontrol I made to my form being able to set a picture in the Image control and set a text in the TextBlock control. Also adding a hover and click visual effect to is my goal but this might take a little while to get it done.

So, I assume I only want to set a text, Mode=OneWay is right from what I read on the internet? The thing is, I have the code set up in my usercontrol. From my point of view it looks easier that I'm able to just do name.Text="blabla"; instead of adding a property to my MainWindow C# code.

Also, if I want to add my usercontrol with a picture and text when I press a button, it looks like it's not neccesary to add a property in my Mainwindow.

What I actually want is this:
  • Add my usercontrol when I click on a button to my MainWindow
  • Being able to set a text and a weburl or location on my pc in my usercontrol
  • Add a click and hover effect and event to my usercontrol

This might be a lot of work when I'm not even familiar with the basics of WPF but I know how to do this in C#. So yeah, I'm kind off stuck here at this WPF stuff since I find it a lot harder than C# to get used to.

This post has been edited by KFredje: 26 January 2013 - 02:48 PM

Was This Post Helpful? 0
  • +
  • -

#11 tlhIn`toq  Icon User is offline

  • Please show what you have already tried when asking a question.
  • member icon

Reputation: 5529
  • View blog
  • Posts: 11,843
  • Joined: 02-June 10

Re: Drawing on MouseEnter, Invalidate on MouseLeave

Posted 26 January 2013 - 03:09 PM

You don't have to set properties in your main window. That's kinda the point to keep all the properties related to the UserControl *IN* the UserControl.

Quote

Being able to set a text and a weburl or location on my pc in my usercontrol


I would make a public property in the UserControl for Picture. When that is set, the userControl code sets the incoming picture to the PictureBox. Same with the Title.

MainWindow sends Picture to UserControl.
UserControl sends the incoming Picture to its PictureBox.

This way the MainWindow is correctly ignorant of the inner workings of the UserControl.

From your mainwindow you see this...
myCoolUserControl.Picture = {whatever};
myCoolUserControl.Title = "Nifty, huh?"



If you *want* you can bind a property in the MainWindow that tunnels down to the UserControl. For example if the Status changes to Status.Stopped, then all the child UserControls get this update and react.


You can also make an event in the UserControl that bubbles up to the Mainwindow. But that's totally optional. That way if the UserControl wants the main app to log something, its the app's responsibility to know how you are logging, and not the child control.

myCoolUserControl.LogThis += AddLogEntry(object sender, LogArgs e);
Was This Post Helpful? 0
  • +
  • -

#12 KFredje  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 131
  • Joined: 06-September 11

Re: Drawing on MouseEnter, Invalidate on MouseLeave

Posted 27 January 2013 - 07:08 AM

So I tried something out but it doesn't appear to work. I try to dynamically at my usercontrol to a wrap panel and set a text in my wrap panel. If I press the button with button1_Click my usercontrol got added to the wrap panel but there is no text in the TextBlock in my control. This is my code:
#Mainwindow.xaml.cs
public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void button1_Click(object sender, RoutedEventArgs e)
        {
            MyButton test1 = new MyButton();
            test1.MyTitle = "testje";
            wrap1.Children.Add(test1);
        }    
    }
#Mainwindow.xaml
<Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:Movie_List" x:Class="Movie_List.MainWindow"
        Title="MainWindow" Height="350" Width="525"
        DataContext="{Binding RelativeSource={RelativeSource Self}}"
>
    <Grid>
        <Grid.Background>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="Black" Offset="0"/>
                <GradientStop Color="White" Offset="1"/>
            </LinearGradientBrush>
        </Grid.Background>
        <Button x:Name="button1" Content="Lol" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="75" Click="button1_Click"/>
        <WrapPanel x:Name="wrap1" HorizontalAlignment="Left" Height="216" Margin="97,69,0,0" VerticalAlignment="Top" Width="322">
            <Button Content="Button" Width="75"/>
        </WrapPanel>
    </Grid>
</Window>

#MyButton.waml
<UserControl x:Class="My_List.MyButton"
             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" 
             mc:Ignorable="d" Height="200" Width="100
             ">
    <Grid>
        <Image x:Name="ImageMyPoster" Source="{Binding MyPoster}" Height="150" VerticalAlignment="Top"/>
        <TextBlock x:Name="tbkMyTitle" 
                   HorizontalAlignment="Left" 
                   Margin="0,150,0,0" 
                   TextWrapping="Wrap" 
                   VerticalAlignment="Top" 
                   Width="100" MaxWidth="100" MinWidth="100" 
                   TextAlignment="Center" 
                   Text="{Binding Path=MyTitle,Mode=OneWay}"
                   />
        <Border BorderBrush="Black" BorderThickness="1"/>
    </Grid>
</UserControl>

#MyButton.waml.cs
public partial class MyButton : UserControl, INotifyPropertyChanged
    {
        #region Local variables
        private string _MyTitle = "";
        #endregion

        #region Public properties
        public event PropertyChangedEventHandler PropertyChanged;

        protected void NotifyPropertyChanged(String info)
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(info));
            }
        }

        public string MyTitle
        {
            get { return _MyTitle; }
            set
            {
                _MyTitle = value;
                NotifyPropertyChanged("MyTitle");
            }
        }
        #endregion

        public MyButton()
        {
            InitializeComponent();
        }
    }


Also if I add the usercontrol directly to my window in the editor, I'm not able to set a text in the TextBlock. This is the code:
# Mainwindow.xaml
<local:MyButton x:Name="testpanel1" HorizontalAlignment="Left" Margin="10,69,0,0" VerticalAlignment="Top"/>
#Mainwindow.xaml.cs
private void button1_Click(object sender, RoutedEventArgs e)
        {
            testpanel1.MyTitle = "lol";
        }   

This post has been edited by KFredje: 27 January 2013 - 07:12 AM

Was This Post Helpful? 0
  • +
  • -

#13 tlhIn`toq  Icon User is offline

  • Please show what you have already tried when asking a question.
  • member icon

Reputation: 5529
  • View blog
  • Posts: 11,843
  • Joined: 02-June 10

Re: Drawing on MouseEnter, Invalidate on MouseLeave

Posted 27 January 2013 - 01:51 PM

Let's address a couple things.
Adding a <border /> tag at the end of several statements won't do anything because it will be a border with nothing in it.
Like other tags borders expect to have other controls inside them. It should have a starting tag and an ending tag with a bunch of controls in between.

Next, don't expect controls to just stack themselves automatically (some will some won't). But there is a <StackPanel> control that will do this for you. You'll see it used in the Mainwindow.xaml below This way everything will stack automatically and give you results you expect without hardcoding the margins etc.

I've also changed your hardcoded width and height to d:designwidth and d:designheight, and taken out all the hardcoded sizing.
This way the UserControl can scale to the space needed. Think of it this way: Its not the job of the control to dictate its size most times. Its the responsibility of the windows that is using the control to say how big it is needed to be. You'll notice in the code below for the mainWindow that we are deciding its size there. Don't micromanage this stuff if you don't have to. Let WPF do its presentation thang.

Your mainWindow XAML.
Everything is statically positioned by use of hardcoded Margins. I know this happens when you just drag and drop a control onto the form from the toolbox. But it is horrible example XAML. IT doesn't show off any of the fluidity of what WPF can do. By using StackPanels and other constructs a WIndow can become very self-adjusting. It looks like you started to see this idea when you put a <Button> in a <WrapPanel>.

You had a problem with the UserControl not updating its MyTitle property. Easy oversight caused that. The same way you set the DataContext for the Window you needed to do the same for the UserControl. Without telling the UserControl to look within its own self for that property it didn't know where to find it.

I did a little cleaning up and this is the updated look.
Notice how the Title moves automatically to be a the bottom of the image.
How the entire PosterButton resizes to fit the image.

Have some fun dissecting and altering the example. Play with it to get a better feel for how all the WPF stuff works. Notice how we don't always hardcode set sizes, but perhaps minimum sizes just to keep a somewhat expected appearance even if there is no content.

Posted Image


Mainwindow.xaml
Spoiler


Mainwindow.xaml.cs
Spoiler



PosterButton.xaml
Spoiler



PosterButton.xaml.cs
Spoiler

This post has been edited by tlhIn`toq: 27 January 2013 - 01:56 PM

Was This Post Helpful? 1
  • +
  • -

#14 KFredje  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 131
  • Joined: 06-September 11

Re: Drawing on MouseEnter, Invalidate on MouseLeave

Posted 28 January 2013 - 08:24 AM

Thanks a lot for helping me start to get into WPF. I'm sure I can get going on my own a while now since I have a clear view how most of the basic stuff work in WPF.

Again, thank you.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1