# Rotate and scale in

**URL:** <https://forums.fusetools.com/t/rotate-and-scale-in/6531>\
**Category:** How-to Discussions\
**Created:** [July 25, 2017, 9:29am UTC](https://forums.fusetools.com/t/rotate-and-scale-in/6531 "2017-07-25T09:29:38Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Iain](https://avatars.discourse-cdn.com/v4/letter/i/d2c977/32.png) [@Iain](https://forums.fusetools.com/u/Iain)\
**Post date:** [July 25, 2017, 9:29am UTC](https://forums.fusetools.com/t/rotate-and-scale-in/6531/1 "2017-07-25T09:29:38Z")

</div>

Hi,

Please excuse the simple questions! (I’m still leaning the “Fuse way”)

I have the following:

```auto
<Panel Padding="50">
  <Image File="../Assets/card.png">
    <Activated>
      <Rotate Degrees="360" Duration="0.5"/>
      <Scale Factor="0" Duration="0.5"/>
    </Activated>
  </Image>
</Panel>

```

This creates an image in a panel so that the image width is constrained by the panel and it’s padding. When the app is started the image rotates and scales down to 0 (disappears).

What I would like to do is to do this in reverse so that as the app starts the image scales from 0 to the size as would be constrained by the panel (and rotates also).

Can anyone explain how I can set the initial 0 size and then scale to size = “auto”?

Many thanks,  
Iain

---

<div class="post-metadata">

**Author:** ![Uldis](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/uldis/32/657_2.png) [@Uldis](https://forums.fusetools.com/u/Uldis)\
**Post date:** [July 25, 2017, 9:44am UTC](https://forums.fusetools.com/t/rotate-and-scale-in/6531/2 "2017-07-25T09:44:49Z")

</div>

You will want to use [AddingAnimation](https://www.fusetools.com/docs/fuse/triggers/addinganimation) for this. Note that it is played backwards by default, so you need to invert the animators inside of it. Here’s the code:

```auto
<Panel Padding="50">
  <Image ux:Name="theImage" File="../Assets/card.png">
    <Scaling ux:Name="theScaling" Factor="1" />
    <AddingAnimation>
        <Change theScaling.Factor="0" Duration="1" />
        <Rotate Target="theImage" Degrees="-360" Duration="1" />
    </AddingAnimation>
  </Image>
</Panel>

```

---

<div class="post-metadata">

**Author:** ![Iain](https://avatars.discourse-cdn.com/v4/letter/i/d2c977/32.png) [@Iain](https://forums.fusetools.com/u/Iain)\
**Post date:** [July 25, 2017, 11:09am UTC](https://forums.fusetools.com/t/rotate-and-scale-in/6531/3 "2017-07-25T11:09:34Z")

</div>

Ok great, I see. Is there some documentation for `<Scaling>`? I couldn’t seem to find it.

---

<div class="post-metadata">

**Author:** ![Uldis](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/uldis/32/657_2.png) [@Uldis](https://forums.fusetools.com/u/Uldis)\
**Post date:** [July 25, 2017, 11:11am UTC](https://forums.fusetools.com/t/rotate-and-scale-in/6531/4 "2017-07-25T11:11:50Z")

</div>

There sure is, [here you go](https://www.fusetools.com/docs/fuse/scaling). It’s frequently easier to just use the search in the top-left corner when you know a particular class name.

---

<div class="post-metadata">

**Author:** ![Iain](https://avatars.discourse-cdn.com/v4/letter/i/d2c977/32.png) [@Iain](https://forums.fusetools.com/u/Iain)\
**Post date:** [July 26, 2017, 1:02pm UTC](https://forums.fusetools.com/t/rotate-and-scale-in/6531/5 "2017-07-26T13:02:48Z")

</div>

Thanks!