DIP (not me but the command)

[wheretheidivides]

OK, so I programmed a card game and it looked fine on my samsung galaxy S epic 4g. I just got a Zeki 7" tablet and whamo, it didn't look so good. It is small. So I'm guessing it that I programmed it with pixels and not percentage of the screen. (I get 10 points for that).

So my first question is the layout. How do I get the layout to go full screen? I have it at 320x480 and 480x800 in the layouts so I have 2 seperate layout variants.

I believe the Zeki is 800x480 native resultion. So question #2 is why doesn't the layout variation work?

Question 3: I can hook my phone to the laptop and b4a bridge sees it no problem. When I do the same with the tablet. nothing. I need the desginer. Can not find the designer on google player. b4a bridge is there, but no designer. What am I missing.

OK, here is sample code of my game. These come from different areas.
=====================================
this is initially setting up the panels
Panel1.Top = 0
Panel1.Left = 0
=================================
later the card is shown. animated from small to big
CardPlayerRightSide1.Width=0 'width 70/105
CardPlayerRightSide1.Height=36 'height 96/144

CardPlayerRightSide1.Visible=True

For Bigger=1 To 16
CardPlayerRightSide1.Width = CardPlayerRightSide1.Width + 5dip
CardPlayerRightSide1.Height = CardPlayerRightSide1.Height + 5dip
DoEvents
Next
======================================
late the card is rotated 90 degress and then animated from small to full size:

CardPlayerRightSide2Rotated.Width=36
CardPlayerRightSide2Rotated.Height=0

CardPlayerRightSide2Rotated.Visible=True

For Bigger=1 To 16
CardPlayerRightSide2Rotated.Width = CardPlayerRightSide2Rotated.Width + 5dip
CardPlayerRightSide2Rotated.Height = CardPlayerRightSide2Rotated.Height + 5dip
DoEvents
Next
=====================================
The thing is the background is full screen but the panel seems to be at a set resultion.
so what am i missing here? How do I get the layout to go full screen? are these dips right? will the wrold end on dec 21, 2012?

 

[wheretheidivides]

Now I did manage to go into the designer and create a new variant with the 7" tablet. Now I have to get it to the tablet to test. But I thought that if you had the default layout variant of 320x480, then it would deaflut to it on the tablets.

So my next question is can i creat 1 layout for everything or do i have to create 8 variations, 1 for each tablet/phone? if so, then what happens if a new screen resultion come out? I know there is a 8" tablet but there is not 8" variant on the layout.

 

[Erel]

See this tutorial:
Supporting multiple screens - tips and best practices

 

[wheretheidivides]

When i look at the abstract designer, the title bars says a resolution. When i create a variant for it, it says stay at 1.0 scale at 640x1018. Is it me or is this some weird resolution?

 

[Erel]

This is probably the "normalized" variant (explained in the tutorial). Which device have you chose in the devices list?

 

[wheretheidivides]

I choose 'match connected device"

 

[Erel]

So what is the connected device values? You can see them near the designer properties box.

 

[wheretheidivides]

ok so i tried the script and it worked, sort of.

'All variants script
AutoScaleAll
AutoScaleRate(1)

So this made the panel from 1/4 of the screen to now 1/2 of the screen size of that table. What is weird is that zeki says the tablet is 480x 800. if true then i think this is where we are. but when i expand out the panel full screen i get a resultion of around 1070x590. so it seems it is going to 480x800 but the screen is 1070x590

800x444 scale .75 is what the abstract designer says it it.

 

[wheretheidivides]

so i tried this in the designer and it seems to be close. in the tutorial it didnt say the auto scales was to be first.

AutoScaleRate(.8)
AutoScaleAll

so it this the correct format? i remeber something saying it had to be scale of 1?

 

[Erel]

This is the correct format.

i remeber something saying it had to be scale of 1?

The values range including the default value are mentioned in the tutorial.

 

[wheretheidivides]

As far as scaling and designer scripts, I mostly understand it, but have a few questions.

1) why doesn't autoscale everything in the designer work again? Am I right to assume if i autoscale it will work with the same screen size properly but not other screen sizes?

2) I have 2 layout variants in my program. a 320x480 scale 1 and a 480x800 scale 1.5 (which it changes to 320x533 scale 1). The second variant works on my cell phone (samsung epic 4g galaxy s). If i use the first variant there is a black bar at the botom of the phone. So my question is will tablets use this variant how exactly? My tablet has a 444x800 scale .75 (which changes to 592x1066 scale 1).

3) Do do I have to have 3 layout variants? 320x480, 320x533 and 592x1066? The second and third variants are longer than 320.480. Just a little confused. and I have read all of the tutorials.

4) if I use a scale size of .83 it seems to get close to filling up the whole screen. But using .1 to .3 doesn't. Why is .83 wrong?

 

[wheretheidivides]

1 more question about DIP. Using autoscale in the layout designer makes everything look fine (but have issue filling up different screen sizes) large. However 1 thing does not. I have a card game and the cards animate from small to large. They still look small. I know it's a dip thing.

The cards are 71x96 size in the layout of 320x480.

=============================
the code to animate is here. It goes from nothing to full size. On the small cell phone it works fine but on the 7" tablet it looks small and squezed. I know it's some dip thing.

   CardPlayerRightSide1.Width=0
   CardPlayerRightSide1.Height=36
      
   CardPlayerRightSide1.Visible=True
   
   For Bigger=1 To 16
      CardPlayerRightSide1.Width = CardPlayerRightSide1.Width + 5dip
      CardPlayerRightSide1.Height = CardPlayerRightSide1.Height + 5dip
   DoEvents
   Next

===============================
So i just want to animate the card from small to full size. I came up with the code above as it animates at a medium speed. What am I missing to get it to animate and look at the correct size? I thought DIP was screen percent.

 

[wheretheidivides]

OK, so I have 2 layout variations now
320x480 scale 1
320x533 scale 1

in the script i have

AutoScaleRate(.0)
AutoScaleAll

If i set it to .1 ot .2 or .3 it's too big on the phone, so i put it to .o. if i don't have a scale rate, it is alos too big. so i pout it in with a scale rate of .0. It looks fine on my cell phone (which uses 320x533). So the question is will putting it at .0 mess up screens on other phones?

I haven't tested this out on tablet yet as i need a wifi connection or it won't work.

 

[Erel]

Settings a scale of 0 means that AutoScaleAll will not have any effect.

This is fine if you want to make the adjustments yourself (by using multiple variants or other script code).

I recommend you to remove the second variant.

 

[wheretheidivides]

OK, I am working on scale for different devices. Here are 3 layout variants.

320x480 (Generic)
320x533 (Samsung galaxy s 1)
640x1018 (Zeki 7" tablet)

Fo the 640x101 I use the following code

AutoScaleRate(.85)
AutoScaleAll

Everything looks good, but the bottom of the screen has a black bar. This is due to the aspect ratio being longer. On the 320x533, I made the panels (about 10 of them) longer to compensate. Looks fine. But isn't that defeating the purpose of autoscale? Is there a way to scale it .85 horizontal and say 1.0 vertical? I know it'll looked stretched. or is there some code to stretch out just the panels so they fill the screen?

 

[wheretheidivides]

So I am still having issues on the layout designer and script. Could someone give the code to put into the designer to autoscale? DO I need different layouts or can it be done with 1 layout? I have a layout of 320x480 which scales fine but looking on a tablet at 480x800, it's off. I got around this by making the panels 320x520. The extra room would then be at the bottom of the screen so the background doesnt show.

AutoScaleAll

Thanks for all of the people who replied thus far.

 

[Erel]

I recommend you to go over these two tutorials:
Supporting multiple screens - tips and best practices
Designer Scripts & AutoScale Tutorial

Note that the most important value is missing in your post which is the device scale value.

 

[wheretheidivides]

I recommend you to go over these two tutorials:
Supporting multiple screens - tips and best practices
Designer Scripts & AutoScale Tutorial

Note that the most important value is missing in your post which is the device scale value.

========================
Ok, so I'm sort of understanding scaling. Correct me if i am off here. I need several layouts (but how do i combine these to just 1)
1) create layout at 320x480 scale 1.
(from what I understand everything is based off of this variant)

Panel1.height = 100%y
Panel3.height = 100%y
Panel71.height = 100%y
Panel72.height = 100%y
Panel73.height = 100%y
Panel74.height = 100%y
Panel75.height = 100%y
Panel75B.height = 100%y
Panel76.height = 100%y
Panel77.height = 100%y
Panel78.height = 100%y
Panel79.height = 100%y
Panel80.height = 100%y

2) create a variant at 320x533 scale 1. Then move the buttons vertical to compensate for the aspect ratio difference. it's longer. So now I have a 2nd variant for my samsung sell phone.

use the following code in the variant specific. This is to stretch out the panels because they don't go all of the way to the bottom of the screen. It's just background so it doesn't matter if they look stretched.

Panel1.height = 100%y
Panel3.height = 100%y
Panel71.height = 100%y
Panel72.height = 100%y
Panel73.height = 100%y
Panel74.height = 100%y
Panel75.height = 100%y
Panel75B.height = 100%y
Panel76.height = 100%y
Panel77.height = 100%y
Panel78.height = 100%y
Panel79.height = 100%y
Panel80.height = 100%y

3) create a variant at 480x800 scale 1 for 7" tablet

AutoScaleRate(.75)
AutoScaleAll
'
Panel1.height = 100%y
Panel3.height = 100%y
Panel71.height = 100%y
Panel72.height = 100%y
Panel73.height = 100%y
Panel74.height = 100%y
Panel75.height = 100%y
Panel75B.height = 100%y
Panel76.height = 100%y
Panel77.height = 100%y
Panel78.height = 100%y
Panel79.height = 100%y
Panel80.height = 100%y

4) create a variant at 640x1018 scale 1 for my tablet. But now the problem is a little different. It looks like #2 above with the bottom off because of the aspect ratio being longer. Do I do the same as #2 and just move the buttons until they look good?

AutoScaleRate(.85)
AutoScaleAll
'
Panel1.height = 100%y
Panel3.height = 100%y
Panel71.height = 100%y
Panel72.height = 100%y
Panel73.height = 100%y
Panel74.height = 100%y
Panel75.height = 100%y
Panel75B.height = 100%y
Panel76.height = 100%y
Panel77.height = 100%y
Panel78.height = 100%y
Panel79.height = 100%y
Panel80.height = 100%y

----------------------------------------------
So this is where I am at. Not sure how to get 1 layout to bet the buttons to look right. There is bottom of screen with nothing due to aspect ratio. On the tutorials it just showed examples of docking to edge of scree or centering. These do not work for my program. I tried using percentages for buttons but thay didn't work. ANy ideas?

 

[Erel]

I'm afraid that you didn't understand correctly. You should only use a single variant.

The script and AutoScale should take care of "fine tuning" the layout to match the actual device size.

 

[wheretheidivides]

I'm afraid that you didn't understand correctly. You should only use a single variant.

The script and AutoScale should take care of "fine tuning" the layout to match the actual device size.

So then how do you get multiple sizes in 1 variant? I mean the aspect ratios are different so you have to auto size.

For example:
320x480
Do not autoscale

480x800
AutoScaleRate(.85)

So each has a different scale. How do you get these in 1 variant? I have 3 right now and each has a different scale rate? Is there a command i missed?
===================
Also, imageviews dont seem to resize. I found this solution. I had a panel with a *.png file. When I changed it to *.bmp, it resized properly.