Find mobile desktop Icon with and height

Cocos Creator
#1

I am building a prank game that simulate the mobile home screen.

I have identify the window size using;

var windowSize = cc.winSize;

I want to lay the images of icons in a grid that found in home screen eg, mail, camera, pictures etc.

I have to resize these images to a size consistence with the actual mobile home screen so that it looks similar to the actual home screen.

The problem I am facing is, how to identify actual with and height of icon in the users phone ?

#2

What is with and height of icon?do you use sprite component and have change the Size Mode?

#3

All image I plan to use are 250x250px size.

The plan is to figure out what is the width height of icon based on the resolution is and resize the sprite. Then place them in the exact position.

It has to look like a real home screen.

For example;
on iPhoneX home screen has 4 icons in a row.
In Samsung Galaxy has 5 icons in a row

#4

I just provide a fullscreen test code, show you how convert a real screen point to canvas location. You can refer to and then implement your code.
fullscreen.zip (277.3 KB)

1 Like