Solved

Xaml noob having no luck with .Streach

Posted on 2013-11-08
15
144 Views
Last Modified: 2013-11-13
I'm trying to place an Ellipse in a Button so that when the Button sizes, the Ellipse does too.  

Simple enough ?  I can't get it to work :(
0
Comment
Question by:Dodsworth
  • 8
  • 7
15 Comments
 
LVL 96

Expert Comment

by:Bob Learned
ID: 39635718
Can you show me the XAML that you are working with please?
0
 
LVL 1

Author Comment

by:Dodsworth
ID: 39636638
          <Button HorizontalAlignment="Left" Margin="79,82,0,0" VerticalAlignment="Top">
                <Ellipse Fill="#FFF4F4F5" Height="100" Stroke="Black" Width="100" Stretch="Uniform"/>
            </Button>

Open in new window


oops I spelt Stretch wrong in the title !
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 39637393
Maybe you are looking for Stretch="Fill", instead of Stretch="Uniform":

<Button HorizontalAlignment="Left" Margin="79,82,0,0" VerticalAlignment="Top">
   <Ellipse Fill="#FFF4F4F5" Height="100" Stroke="Black" Width="170" Stretch="Fill"/>
</Button>

Open in new window

0
 
LVL 1

Author Comment

by:Dodsworth
ID: 39638114
Fill does nothing at all.  I read that fill was the default behaviour for an ellipse.

For Ellipse or Rectangle, the default Stretch behavior is Fill, because their entire sizing logic is based on the Width and Height. Setting Stretch to None for an Ellipse or Rectangle effectively makes it nonrendering.

The only option that seems to do any sizing at all is UniformToFill, but that clips the ellipse.
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 39638506
That XAML filled the button area with an ellipse, instead of making the width and height the same dimensions.  The button dimensions are set by the dimensions of the ellipse.
0
 
LVL 1

Author Comment

by:Dodsworth
ID: 39638761
So how to make the ellipse always fill the button when the button is sized?
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 39638768
I would size the ellipse, and then the button size will follow.  You would need to do that in the XAML editor, instead of the designer.  

If you want something different, then we would need to find a different approach.
0
DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

 
LVL 1

Author Comment

by:Dodsworth
ID: 39639382
OK.. I'll come clean.

I actually want to inherit an ellipse and add properties to it.

Getting nowhere with that, I thought about putting an ellipse in a button, inheriting the button in my class and hoping XAML would sort the sizing of the ellipse ?

*pulls out hair*
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 39639408
If you want to inherit from an Ellipse, what type of properties would you be adding, and how would you be using this extended Ellipse?
0
 
LVL 1

Author Comment

by:Dodsworth
ID: 39640985
Ellipses can be created, sized, moved and colo(u)red.  They have an owner, a parent, a sequence number, created/updated date amongst other properties.
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 39641457
What problems did you have inheriting from Ellipse, and extending it with additional properties?

It sounds like you just need a user control that has elliptical behaviors, like this:

<UserControl x:Class="CircleBorderTest.CircleBorder"
             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:local="clr-namespace:CircleBorderTest" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <UserControl.ContentTemplate>
        <DataTemplate DataType="UserControl">
            <DataTemplate.Resources>
                <local:CircleMarginConverter x:Key="CircleMarginConverter"/>
            </DataTemplate.Resources>
            <Grid VerticalAlignment="Center" HorizontalAlignment="Center">
                <ContentPresenter Content="{TemplateBinding Content}">
                    <ContentPresenter.Margin>
                        <MultiBinding Converter="{StaticResource CircleMarginConverter}">
                            <Binding Path="ActualWidth" RelativeSource="{RelativeSource Self}"/>
                            <Binding Path="ActualHeight" RelativeSource="{RelativeSource Self}"/>
                        </MultiBinding>
                    </ContentPresenter.Margin>
                </ContentPresenter>
                <Ellipse HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Stroke="Red" StrokeThickness="1px"/>
            </Grid>            
        </DataTemplate>
    </UserControl.ContentTemplate>
</UserControl>

Open in new window


Usage:

<Window x:Class="CircleBorderTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:circle="clr-namespace:CircleBorderTest"
        Title="MainWindow" Height="350" Width="525">
    <circle:CircleBorder>
    </circle:CircleBorder>
</Window>

Open in new window

0
 
LVL 1

Author Comment

by:Dodsworth
ID: 39641645
Ellipse is NotInheritable for some reason.

I need to create new ellipses from VB.net tho.
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 39642243
The UserControl can be used anywhere, since it is defined in XAML, and it contains an Ellipsis element:

<Ellipse HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Stroke="Red" StrokeThickness="1px"/>
0
 
LVL 1

Author Comment

by:Dodsworth
ID: 39643955
Ok but how do I instantiate it ?
0
 
LVL 96

Accepted Solution

by:
Bob Learned earned 500 total points
ID: 39644545
The example shows how to create an instance:

1) Add a prefix namespace, referencing the assembly where the user control is:

xmlns:circle="clr-namespace:CircleBorderTest"

2) Add an instance to the window, using the prefix + class name.

<circle:CircleBorder>
    </circle:CircleBorder>
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Recently while returning home from work my wife (another .NET developer) was murmuring something. On further poking she said that she has been assigned a task where she has to serialize and deserialize objects and she is afraid of serialization. Wha…
Today I had a very interesting conundrum that had to get solved quickly. Needless to say, it wasn't resolved quickly because when we needed it we were very rushed, but as soon as the conference call was over and I took a step back I saw the correct …
This Micro Tutorial will give you a basic overview how to record your screen with Microsoft Expression Encoder. This program is still free and open for the public to download. This will be demonstrated using Microsoft Expression Encoder 4.
Many functions in Excel can make decisions. The most simple of these is the IF function: it returns a value depending on whether a condition you describe is true or false. Once you get the hang of using the IF function, you will find it easier to us…

895 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now