- Home /
How to move a UI Image from one parent panel to another in Unity?
Hello. I have a Canvas
and on it I have the TopPanel and the BottomPanel. Also I have an Image
that at first is on the BottomPanel. After I clicked some button, this Image should fly to the TopPanel and become a child of the TopPanel. How how should I move this Image
to the TopPanel? How convert its local coordinates into coordinates of Canvas
?
Use a tweening library like DOTween and pass the end value coordinates, on whose complete callback you can reparent your image.
Answer by Knights_user · Dec 05, 2019 at 06:31 AM
Use the following code:
function MoveImage()
{
Image.transform.parent = TopPanel.transform.
}
You don't need to convert any coordinates as only the object will change its placement in the hierarchy, its position will remain same.
EDIT: I have tested the following code. It Works fine. You can add checks if you want to do it on button click.
public class StackS2 : MonoBehaviour
{
public RectTransform mTransform , topPanel;
// Start is called before the first frame update
void Start()
{
}
// Update is called once per frame
void Update()
{
mTransform.position = Vector3.Lerp(mTransform.position , topPanel.position , Time.deltaTime * 1.0f);
}
}
I know this part. But I need this image move smoothly(lerp) to the new parent.
@magister_yoda_ Edited the answer, please check.
Your answer
![](https://koobas.hobune.stream/wayback/20220612215722im_/https://answers.unity.com/themes/thub/images/avi.jpg)