How To Fill a button with a circle

How-to Discussions
1

Hi guys,

i want to make the android button animation while tapping a button.

i write this code:

<Button Text="Login" ux:Name="button" Width="400">
    <Panel>
        <Rectangle ux:Name="circle" Fill="#006666"/>
    </Panel>
    <WhilePressed>
        <Change Target="circle.Width" Value="1000" Duration="3"/>
    </WhilePressed>
</Button>
2

You should probably take a look at these two examples:

https://www.fusetools.com/examples/material-upvote https://www.fusetools.com/examples/circle-menu

3

Mmmh, i don’t think the examples are what i’m looking for. Because i have a Button and i want to Fill the button background with a circle =/

4

Something like this perhaps?

<Button Text="Login" ux:Name="button" Alignment="Center">
    <Panel Layer="Background" ClipToBounds="true">
        <Circle ux:Name="circle" Fill="#006666" Opacity="0"/>
    </Panel>
    <WhilePressed >
        <Scale Target="circle" Factor="3" Duration="0.2"/>
        <Change circle.Opacity="1" Duration="0.2"/>
    </WhilePressed>
</Button>