I want to stretch and display images for UI

Thank you for your help.
We would like to be able to display the UI on different screen sizes.

For example, we have the following image as a header.
short
The height of the image is 32px and the width of the image is the same as the screen size.
This will work.
First, we will use this page as a reference for SLICES.
https://docs.cocos.com/creator/manual/en/ui-system/components/engine/sliced-sprite.html
This lovely header image does not break the heart display no matter how many horizontal lengths are used.
long

I then use SPRITE to place the image. At this point, how do we match the image to the screen size?
You can specify a number for the sprite size, but that will not work when the startup size changes.

It would seem to be a solution if we get the screen size when the game is launched and specify the canvas size and the size of the sprite that needs to be adjusted.
However, this is not a good idea because every time there are more UIs, there are more UIs to resize.

rect

In unity, there is a feature called Anchors that matches the size of the parent UI in this way, and it would be nice to be able to do the same thing.

This page did not help.
https://docs.cocos.com/creator/manual/en/ui-system/components/engine/multi-resolution.html


It is this what you want, If it is. Slice sprite and widget can meet your needs.

By the way, It seems you are not familiar with coocs multi-resolution solutions. Maybe it is vary different with unity. So, why not try fotget unity style and learn cocos style. It’s quite simple and I thing you will understand it vary soon.

Thank you for your response!
Are you saying that I should read this page carefully?
https://docs.cocos.com/creator/manual/en/ui-system/components/engine/multi-resolution.html

Yes, There some important concepts

  • Design resolution
  • Auto fit strategy: fixed height, fixed width
  • Weight compont
  • Slice Sprite
    By using these, most screen adaptation issues are not a problem,
1 Like