Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Codea's pixel use

edited June 2014 in General Posts: 142

I'm using Codea on an iPad mini and when defining the location of sprites and other objects, I was just wondering if when I say for example, WIDTH-100, the location will look the same on an iPad or iPhone or if it needs to be in relation to width (e.g. WIDTH*1/4).

Comments

  • dave1707dave1707 Mod
    Posts: 7,528

    @Staples The ipad and iPad mini with retina display have the same pixel size but the mini has a smaller display size. So WIDTH-100 will be the same except appear smaller on the mini. Even on a retina vs non retina, WIDTH -100 will still be the same because the retina display uses pixels at .5 value increments to give it the higher resolution.

  • Posts: 142

    @dave1707 So, if I wanted it to look the same on all devices, what would I have to do?

  • edited June 2014 Posts: 425

    You could use percentages of the screen size like:

    w=WIDTH/100
    h=HEIGHT/100
    

    So w&h are 1% of the screen size in their relative dimensions

    To get the device type you can use deviceMetrics() like so

    for k,v in pairs(deviceMetrics()) do
            print(k.."="..v)
        end
    
  • dave1707dave1707 Mod
    edited June 2014 Posts: 7,528

    @Staples I ran the below code on my iPad Air (retina) and ipad 1 (non retina) and it looked the same. I'm sure it will look the same on a mini. I can't say what it will look like on an iPhone.


    function setup() end function draw() background(40, 40, 50) fill(255) ellipse(WIDTH-100,300,100) end
  • Posts: 142

    @dave1707 Ok, thanks. I'm pretty far into a project at the moment so I will probably try to finish it to a point and test how it looks. If it looks bad on a non-retina, I will probably use percentages as @Coder described.

  • dave1707dave1707 Mod
    Posts: 7,528

    @Staples I did some other checking and the iPhone 4 has a width to height ratio of 1 to 1.5 . The iPhone 5 has a ratio of 1 to 1.775 . The ipad has a ratio of 1 to 1.333 . So depending on the device, you'll have to scale what's being displayed by those ratios if you want them to look similar.

  • edited June 2014 Posts: 2,042

    @Staples, non retina and retina iPads will look the same using WIDTH - 100. However, if you want it to scale to iPhone as well, you need to use percentages such as WIDTH * 3/4

  • dave1707dave1707 Mod
    Posts: 7,528

    @Staples It should look the same on a retina and non retina device. Only sharper on the retina. The problem you'll have is the iPhone 4 and iPhone 5 that have a lower resolution and different width to height ratios.

  • edited June 2014 Posts: 142

    @dave1707 @JakAttak @Coder I just had an idea and as I don't have an iPhone, I just wanted to verify if this would work. If I used this code

    print(WIDTH)
    print(HEIGHT)
    --let's say it returned width=575 and height=1050
    w = WIDTH/575
    h = HEIGHT/1050
    

    to define 1 pixel on my screen as a percentage. Then if I added *w to all x values and *h to all y values, would it look the same on an iPhone, iPad w/ retina, etc.?

  • dave1707dave1707 Mod
    Posts: 7,528

    @Staples Have a look at the scale() command under GRAPHICS. That might be an easy way to do what you want.

  • dave1707dave1707 Mod
    edited July 2014 Posts: 7,528

    @Staples Here's an example of the scale() command. The rectangle in the lower left of the screen is the dimensions of the iPhone display. I drew some objects on the ipad display, did the scale command and drew the same objects on the iPhone display. You can see how the scale command redraws it to the iPhone scale.

    EDIT: Added code to handle screen rotations.


    Code removed. See discussion "scale command" for new example.
  • Posts: 2,042

    @Staples, to get it to scale by multiplying everything by w and h, do w = WIDTH / 1024 and h = HEIGHT/768 (assuming you are using landscape, if not switch the 768 and 1024. This will give you the scale factor of your screen to an iPad screen, so it should scale properly.

  • Posts: 142

    @JakAttak Oh,ok I just made up the width and height in mine because I didn't have my iPad then. So, even for non-retina displays, the height (in portrait mode) and width are always 1024 and 768?

  • Posts: 2,042

    @Staples, yes, all iPads are 1024 x 768 for Codea

Sign In or Register to comment.