Android Question Widget sizes on xlarge screen phones

eps

Expert
Licensed User
Longtime User
All

I'm really struggling to get my Widget to size properly on my HTC One, 1080x1920 pixel density 3..

If I set it to 290x74 it tells me that it's a 4x2 sized widget.

Has anyone else come across this? I feel like I'm doing something wrong...

I've only got one screen resolution defined, which is 320x480. I had added another, 360x640 but this made little difference.. I've been going round in circles with this!! I've got the Designer Script set to Autoscale All, but does this work for Widgets? If it does then should I be setting it specifically for such high pixel density devices?

I'm starting to think that devices with such a high pixel density as these need a bit of careful manipulation but then again other examples I've tried seem to work okay and size okay.
 

eps

Expert
Licensed User
Longtime User
That's great but I've already been through all of the documentation here and elsewhere.

In the B4A tutorials it indicates setting the width and height to 292 and 74 respectively for a 4x1 grid widget, but this translates to 4x2 on my device, hence the question about devices where the pixel density is set to 3.
 
Upvote 0

DonManfred

Expert
Licensed User
Longtime User
TODAY i asked something similar in German forum. Just a minute ago ;)

Erel wrotes in his Tutorial II this

We are setting the base panel size to 294x72. This is the recommended size for a 4x1 cells widget.

So you are 2 too much ;-)
 
  • Like
Reactions: eps
Upvote 0

eps

Expert
Licensed User
Longtime User
TODAY i asked something similar in German forum. Just a minute ago ;)

Erel wrotes in his Tutorial II this



So you are 2 too much ;-)

Actually that was a mistype on my part, I was 290x72... I think I transposed the 4 from the example from 294 to 74..

294x72 gives me.... 4x2 on my HTC One. So still no joy, I'll see how low I have to get the height to go.. It might be some odd rounding error or limit on the device which I'm just hitting.
 
Upvote 0

DonManfred

Expert
Licensed User
Longtime User
I have a similar problem. My Widget is 294x144 and it should fit on a 4x2 on my samsung note3. It does it! But the 294 is not the real width of my note so a lot of room are unused. In height too but here it is lesser.

But, for your example, on my Note 3 a widget of 290x72 takes place on 4x1. With the same unused space for sure
 
Upvote 0

eps

Expert
Licensed User
Longtime User
There's definitely something odd here.

I think it needs a little looking into. The widgets' height isn't being calculated properly I am 100% sure of that - especially for my device.

I'll post a screenshot to illustrate.

For the record the max that works on my device is : 290x64 , which as the screenshot shows vs. other widgets leaves a _lot_ of screen real estate going begging. Not a few pixels, but more like 30 or 40, which is a lot in this scenario.
 

Attachments

  • Screenshot_2014-01-28-19-40-17.png
    Screenshot_2014-01-28-19-40-17.png
    459.7 KB · Views: 539
Upvote 0

eps

Expert
Licensed User
Longtime User
Upvote 0

corwin42

Expert
Licensed User
Longtime User
This issue is not an Android 4 issue. It happens in all Android versions.

The problem is that B4A creates a non scalable layout (it uses AbsoluteLayout with fixed positions and sizes for the views).

If you want to fix it you have to modify the generated xml files in Objects\res\layout and Objects\res\xml. But be aware that you need knowledge of how widgets work in Android and how to create layouts in XML. It is not really easy to understand completely.

The layout file B4A creates is very limited. You can not use variants or designer scripts. The problem is that it is not possible to get the widget cell size and even on the same device the cell size can vary depending on the launcher used.

My WorldClock example uses the scaling feature though it was not the main reason I created this example. The clock widget should scale properly on all devices and screen sizes but the example is quite complicated because it even shows how to completely change a widget layout.
 
Upvote 0

eps

Expert
Licensed User
Longtime User
This issue is not an Android 4 issue. It happens in all Android versions.

The problem is that B4A creates a non scalable layout (it uses AbsoluteLayout with fixed positions and sizes for the views).

If you want to fix it you have to modify the generated xml files in Objects\res\layout and Objects\res\xml. But be aware that you need knowledge of how widgets work in Android and how to create layouts in XML. It is not really easy to understand completely.

The layout file B4A creates is very limited. You can not use variants or designer scripts. The problem is that it is not possible to get the widget cell size and even on the same device the cell size can vary depending on the launcher used.

My WorldClock example uses the scaling feature though it was not the main reason I created this example. The clock widget should scale properly on all devices and screen sizes but the example is quite complicated because it even shows how to completely change a widget layout.

Cheers, thanks for that, I'll investigate a little further...
 
Upvote 0

eps

Expert
Licensed User
Longtime User
Well so far so good... a quick hack means that my widget now looks like this :



:)

I'll need to test it on some other devices, but this is getting somewhere near to where I want it to be.

All I did was edit the XML file, setting the min height and min width to the appropriate values for 4x1 and then made the file read only. Then I adjusted the size of the widget and then regenerated the code. It will need testing to ensure that it looks okay on other devices, but for the moment it seems to work - i.e. the size reported by the widget is not the size of the widget panel, which seemed to be the part that was causing the issue. Of course Developer beware about doing this!
 

Attachments

  • Screenshot_2014-01-29-12-45-24.png
    Screenshot_2014-01-29-12-45-24.png
    449 KB · Views: 445
Upvote 0

sorex

Expert
Licensed User
Longtime User
In my case I had a 80x80px panel where I placed a 72x40px icon in.

top padding of 20px to center it vertically, and 4 on the left because it's stuck to the screen border if I didn't do it.

so I think a 40 or 42px tile size is used in that grid
 
Upvote 0

DonManfred

Expert
Licensed User
Longtime User
I'll need to test it on some other devices, but this is getting somewhere near to where I want it to be.

All I did was edit the XML file, setting the min height and min width to the appropriate values for 4x1 and then made the file read only.

How does your XML looks like now? Can you please post it here?
 
Upvote 0

eps

Expert
Licensed User
Longtime User
It looks like this :

B4X:
<?xml version="1.0" encoding="utf-8"?>
<appwidget-provider xmlns:android="http://schemas.android.com/apk/res/android"
android:minWidth="250dp"
android:minHeight="40dp"
android:initialLayout="@layout/widget_layout"
android:updatePeriodMillis="1800000" />

You can find it in the directory Object/res/xml - yours will be in there as well.

I decided to go with the newer recommendations on sizings, from the Google/Android link above.
 
Upvote 0

eps

Expert
Licensed User
Longtime User
I've gone with 250dp minimum and 50dp minimum as per :

http://developer.android.com/guide/practices/ui_guidelines/widget_design.html



Determining a size for your widget
Each widget must define a minWidth and minHeight, indicating the minimum amount of space it should consume by default. When users add a widget to their Home screen, it will generally occupy more than the minimum width and height you specify. Android Home screens offer users a grid of available spaces into which they can place widgets and icons. This grid can vary by device; for example, many handsets offer a 4x4 grid, and tablets can offer a larger, 8x7 grid. When your widget is added, it will be stretched to occupy the minimum number of cells, horizontally and vertically, required to satisfy its minWidth and minHeight constraints. As we discuss in Designing Widget Layouts and Background Graphics below, using nine-patch backgrounds and flexible layouts for app widgets will allow your widget to gracefully adapt to the device's Home screen grid and remain usable and aesthetically awesome.

While the width and height of a cell—as well as the amount of automatic margins applied to widgets—may vary across devices, you can use the table below to roughly estimate your widget's minimum dimensions, given the desired number of occupied grid cells:

# of Cells
(Columns or Rows)Available Size (dp)
(minWidth or minHeight)
140dp
2110dp
3180dp
4250dp
……
n70 × n − 30

It is a good practice to be conservative with minWidth and minHeight, specifying the minimum size that renders the widget in a good default state. For an example of how to provide a minWidth and minHeight, suppose you have a music player widget that shows the currently playing song artist and title (vertically stacked), a Play button, and a Next button:


but I've then just set the values within the Designer to those that I want. When the Widget gets considered for adding as a Widget Android will look at the XML, which I made read only. Any changes made within the Designer will not be reflected in the XML file in this instance.
 
Upvote 0
Top