TreeViewNode arrow problem

embryo

unread,

Oct 27, 2019, 12:53:03 PM10/27/19

to Kivy users support

I'm using filechooser in file load/save dialogs

There is a problem with the arrow size in android.

On Windows its OK, but depending on the phone's resolution, its getting smaller and smaller.

This is on a S4

and here on a S6

This is a problem of the arrow placement in the TreeViewNode widget.

When I use it as a tree node in my apps, I subclass and fix it.

But I can't do this for the filechooser, because it uses a template.

What I finally did was to register a "fixed" XTreeViewNode to the factory, and then override the [FileListEntry@FloatLayout+TreeViewNode] with my own [FileListEntry@FloatLayout+XTreeViewNode

It does work... but I get a warning "Deprecated Kivy lang template syntax used".

So, my question is this.

Does anyone knows a way to replace this template with a custom class of my own?

TIA

Elliot Garbus

unread,

Oct 27, 2019, 3:49:56 PM10/27/19

to kivy-...@googlegroups.com

I filed a PR on an issue that may be causing this problem.

I had a similar issue on the mac vs PC.

The file: kivy/data/style.kv defines the base widgets, including the filechooser.

Line 338 contains the code:

height: '48dp' if dp(1) > 1 else '24dp'

this is likely the source of the problem, the PR (accepted) changes the code to:

height: '24dp'

You can edit this file on your machine or download from the master on GitHub.

From: embryo
Sent: Sunday, October 27, 2019 9:53 AM
To: Kivy users support
Subject: [kivy-users] TreeViewNode arrow problem

I'm using filechooser in file load/save dialogs

There is a problem with the arrow size in android.

On Windows its OK, but depending on the phone's resolution, its getting smaller and smaller.

This is on a S4

and here on a S6

This is a problem of the arrow placement in the TreeViewNode widget.

When I use it as a tree node in my apps, I subclass and fix it.

But I can't do this for the filechooser, because it uses a template.

What I finally did was to register a "fixed" XTreeViewNode to the factory, and then override the [FileListEntry@FloatLayout+TreeViewNode] with my own [FileListEntry@FloatLayout+XTreeViewNode

It does work... but I get a warning "Deprecated Kivy lang template syntax used".

So, my question is this.

Does anyone knows a way to replace this template with a custom class of my own?

TIA

--
You received this message because you are subscribed to the Google Groups "Kivy users support" group.
To unsubscribe from this group and stop receiving emails from it, send an email to kivy-users+...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/3db1d2be-a6f7-488c-8554-eddf48291f28%40googlegroups.com.

embryo

unread,

Oct 27, 2019, 4:01:57 PM10/27/19

to Kivy users support

I filed a PR on an issue that may be causing this problem.
I had a similar issue on the mac vs PC.

The file: kivy/data/style.kv defines the base widgets, including the filechooser.

Line 338 contains the code:
height: '48dp' if dp(1) > 1 else '24dp'
this is likely the source of the problem, the PR (accepted) changes the code to:

height: '24dp'

Hmmm.. I don't thing that this is the problem.

Actually, this is a feature that we need.

I think that it makes the widget bigger on displays with higher resolution.

Perhaps the problem is in the TreeViewNode?

embryo

unread,

Oct 27, 2019, 4:06:46 PM10/27/19

to Kivy users support

Any info on how to replace the template with a custom class?

Elliot Garbus

unread,

Oct 27, 2019, 4:11:01 PM10/27/19

to kivy-...@googlegroups.com

The use the dp metric scales the size based on density.

The 48dp improperly scaled the widget.

This is why the lines are too wide on your widget.

I suggest taking a look in style.kv for other resolution related issues to help solve your problem.

From: embryo
Sent: Sunday, October 27, 2019 1:02 PM
To: Kivy users support

--

You received this message because you are subscribed to the Google Groups "Kivy users support" group.
To unsubscribe from this group and stop receiving emails from it, send an email to kivy-users+...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/d4f902a5-5ffb-49bc-9028-90c6a34f0b3e%40googlegroups.com.

embryo

unread,

Oct 27, 2019, 4:21:28 PM10/27/19

to Kivy users support

The use the dp metric scales the size based on density.
The 48dp improperly scaled the widget.

This is why the lines are too wide on your widget.

They are not wide.

They are OK for the mobile.

Maybe they look wide in the screenshot, but the size is nice (both on PC and mobile).

The problem is with the arrow.

I suggest taking a look in style.kv for other resolution related issues to help solve your problem.

I did look, but what I'm looking for is a way to access this arrow or create a new widget.

From: embryo
Sent: Sunday, October 27, 2019 1:02 PM
To: Kivy users support
Subject: Re: [kivy-users] TreeViewNode arrow problem
I filed a PR on an issue that may be causing this problem.
I had a similar issue on the mac vs PC.

The file: kivy/data/style.kv defines the base widgets, including the filechooser.

Line 338 contains the code:
height: '48dp' if dp(1) > 1 else '24dp'
this is likely the source of the problem, the PR (accepted) changes the code to:

height: '24dp'
Hmmm.. I don't thing that this is the problem.
Actually, this is a feature that we need.
I think that it makes the widget bigger on displays with higher resolution.

Perhaps the problem is in the TreeViewNode?

--
You received this message because you are subscribed to the Google Groups "Kivy users support" group.

To unsubscribe from this group and stop receiving emails from it, send an email to kivy-...@googlegroups.com.

Elliot Garbus

unread,

Oct 27, 2019, 4:54:23 PM10/27/19

to kivy-...@googlegroups.com

Comparing the size of the lines in Windows, vs your image, I assert the lines are too wide.

Try making the change and see what happens – it is a quick test.

Line 237 in style.kv is where the image is coming from.

Line 227 starts the definition of TreeViewNode,

You can use <-TreeViewNode> to redefine the TreeVewNode in your code.

To unsubscribe from this group and stop receiving emails from it, send an email to kivy-users+...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/16b231be-7f31-4955-9349-f634af31cc55%40googlegroups.com.

embryo

unread,

Oct 27, 2019, 5:12:55 PM10/27/19

to Kivy users support

Comparing the size of the lines in Windows, vs your image, I assert the lines are too wide.

Yes, in the screenshots it seems that the lines are wide, but remember that you are looking at a mobile screen (~7x12cm) and a monitor (~30x50cm)

Believe me, the size is not the problem.

Try making the change and see what happens – it is a quick test.

Its not that quick for me, since I have to re-build the app (using a VM ;o)

I'll do it after I finish some stuff...

Line 237 in style.kv is where the image is coming from.
Line 227 starts the definition of TreeViewNode,

You can use <-TreeViewNode> to redefine the TreeVewNode in your code.

This is what I've already done for the "fixed" version (as I said at the OP), but its a workaround, not a solution.

The first problem was with the TreeViewLabel, so I had to replicate code for TreeViewLabel, Label and TreeViewNode inside my kv.

Thank you anyway. I will re-build and report..:o)

embryo

unread,

Oct 27, 2019, 5:22:55 PM10/27/19

to Kivy users support

Actually, now that I think about it, I'm not sure that I can try it, because I use buildozer to create the android .apk and I think that it downloads its own kivy version. :o(

embryo

unread,

Oct 28, 2019, 9:24:10 AM10/28/19

to Kivy users support

Update:

I finally created a new apk and the results are worst than I thought.

The screenshots I posted earlier were with an older apk (using and older version of kivy).

Here are the new screenshots (kivy 1.11.1):

Using the original code:

x.orig.png

... and changing the `height: '48dp' if dp(1) > 1 else '24dp'` to `height: '24dp'`:

x.wrong_pr.png

The rows here are almost impossible to tap.

Please @Eliot, reconsider this PR. It will create a usability problem with the mobile devices..

Trying to fix somewhat the positioning of the arrow, I changed the original `pos: self.x - 20, self.center_y - 8` that uses absolute pixels to `pos: self.x - dp(20), int(self.center_y - self.height / 4.)` that doesn't [line 239]. This change produces this, while keeping the desktop version the same as before:

x.fix.png

Perhaps something must be done with the size too, but overall I think it works much better...

Elliot Garbus

unread,

Oct 28, 2019, 12:05:16 PM10/28/19

to kivy-...@googlegroups.com

Your ‘original’ code is the exact problem I had on the Mac.

I’ll take a at the filechooser later today. Have you tired adjusting the font size?

There are a number of spots in style.kv that incorrectly use absolute pixel sizes.

What is the pixel density on your mobile device (what is dp(1)?)

From: embryo
Sent: Monday, October 28, 2019 6:24 AM
To: Kivy users support
Subject: Re: [kivy-users] TreeViewNode arrow problem

Update:

I finally created a new apk and the results are worst than I thought.

The screenshots I posted earlier were with an older apk (using and older version of kivy).

Here are the new screenshots (kivy 1.11.1):

Using the original code:

... and changing the `height: '48dp' if dp(1) > 1 else '24dp'` to `height: '24dp'`:

The rows here are almost impossible to tap.

Please @Eliot, reconsider this PR. It will create a usability problem with the mobile devices..

Trying to fix somewhat the positioning of the arrow, I changed the original `pos: self.x - 20, self.center_y - 8` that uses absolute pixels to `pos: self.x - dp(20), int(self.center_y - self.height / 4.)` that doesn't [line 239]. This change produces this, while keeping the desktop version the same as before:

Perhaps something must be done with the size too, but overall I think it works much better...

--

You received this message because you are subscribed to the Google Groups "Kivy users support" group.
To unsubscribe from this group and stop receiving emails from it, send an email to kivy-users+...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/c4f44377-0913-4e2f-8e4d-03a55fb25898%40googlegroups.com.

embryo

unread,

Oct 28, 2019, 12:13:22 PM10/28/19

to Kivy users support

Changing the `size: self.height / 2., self.height / 2.` to `size: self.height / (3. if dp(1) > 1 else 2.), self.height / (3. if dp(1) > 1 else 2.)` fixes the size too.

x.fix_size.png

embryo

unread,

Oct 28, 2019, 12:32:27 PM10/28/19

to Kivy users support

My dp(1) = 3.0

I saw the current code at github and noticed that the absolute pixels are now in dp.

That alone can not fix the problem.

It produces this

x.current_code.no_resize_row.png

The arrow is still big and not vertically centered (its closer to the top)

Using it with the other change of the row height gives this

x.current_code.png

that is the same as the PC but is impossible to use with a mobile.

Its too narrow!!

The code I use above, is more complicated (every suggestion is welcome) but it works much better..

embryo

unread,

Oct 28, 2019, 12:39:41 PM10/28/19

to Kivy users support

Just created a PR here.

Elliot Garbus

unread,

Oct 28, 2019, 4:24:30 PM10/28/19

to kivy-...@googlegroups.com

Looks interesting. Congrats on your first PR.

Have you tested this on Windows (dp(1) == 1) and Mac (dp(1) ==2)?

Give the need to have wider ‘bars’ to click on for mobile, does it make sense to make changes to support different font sizes (assuming different font sizes are not supported now)?

From: embryo
Sent: Monday, October 28, 2019 9:39 AM
To: Kivy users support
Subject: Re: [kivy-users] TreeViewNode arrow problem

Just created a PR here.

--

You received this message because you are subscribed to the Google Groups "Kivy users support" group.
To unsubscribe from this group and stop receiving emails from it, send an email to kivy-users+...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/041c3ead-622d-480c-ac94-f76999903691%40googlegroups.com.

embryo

unread,

Oct 28, 2019, 5:14:22 PM10/28/19

to Kivy users support

On Monday, October 28, 2019 at 10:24:30 PM UTC+2, Elliot Garbus wrote:

Looks interesting. Congrats on your first PR.

Have you tested this on Windows (dp(1) == 1) and Mac (dp(1) ==2)?
Give the need to have wider ‘bars’ to click on for mobile, does it make sense to make changes to support different font sizes (assuming different font sizes are not supported now)?

What we need is a way to distinguish between PC/Mobiles.

Is it possible?

embryo

unread,

Oct 28, 2019, 5:35:49 PM10/28/19

to Kivy users support

Perhaps its safer to check if the platform is Android/iOS or Windows/Linux/Mac?

Elliot Garbus

unread,

Oct 28, 2019, 7:53:20 PM10/28/19

to kivy-...@googlegroups.com

It is an interesting problem, how to create a file chooser that spans from devices with density ranges from 1 to 3, and enormous swings in screen size.

I think the kivy metrics are the right tool. They should provide a device independent way to scale fonts and screen sizes based on density.

It may be useful to look at the ability to extend the filechooser with a few extra parameters, to support certain optimizations.

Doing a few experiments would be the next step.

I don’t think checking for the platform is something that should be done in the filechooser. I would think that is best left for the developer with an understanding of the platforms they are targeting.

If your interested in collaborating – we can start up a GitHub repository and explore a few alternatives.

I have a mac dp(1) ==2, and Windows10 dp(1) ==1.

Of course the changes you have already made might be sufficient, what do you think?

From: embryo
Sent: Monday, October 28, 2019 2:35 PM
To: Kivy users support
Subject: Re: [kivy-users] TreeViewNode arrow problem

Perhaps its safer to check if the platform is Android/iOS or Windows/Linux/Mac?

--

You received this message because you are subscribed to the Google Groups "Kivy users support" group.
To unsubscribe from this group and stop receiving emails from it, send an email to kivy-users+...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/04906068-ef88-4a69-a341-09ef341a0b3c%40googlegroups.com.

embryo

unread,

Oct 28, 2019, 8:31:46 PM10/28/19

to Kivy users support

My code is just a workaround that works for now.

I do believe that eventually, it should be fixed in a more elegant way.

I can try some experiments if you like, but keep in mind that I am a total novice in the github ways :o)

I can use my Windows 7 PC, a mobile with 1080 x 1920 ~441 ppi (dp(1)==3) and one with 1440 x 2560 ~577 ppi (don't know the dp(1) yet)

On Tuesday, October 29, 2019 at 1:53:20 AM UTC+2, Elliot Garbus wrote:

It is an interesting problem, how to create a file chooser that spans from devices with density ranges from 1 to 3, and enormous swings in screen size.
I think the kivy metrics are the right tool. They should provide a device independent way to scale fonts and screen sizes based on density.
It may be useful to look at the ability to extend the filechooser with a few extra parameters, to support certain optimizations.

Doing a few experiments would be the next step.

I don’t think checking for the platform is something that should be done in the filechooser. I would think that is best left for the developer with an understanding of the platforms they are targeting.

If your interested in collaborating – we can start up a GitHub repository and explore a few alternatives.
I have a mac dp(1) ==2, and Windows10 dp(1) ==1.

Of course the changes you have already made might be sufficient, what do you think?

From: embryo
Sent: Monday, October 28, 2019 2:35 PM
To: Kivy users support
Subject: Re: [kivy-users] TreeViewNode arrow problem

Perhaps its safer to check if the platform is Android/iOS or Windows/Linux/Mac?

--
You received this message because you are subscribed to the Google Groups "Kivy users support" group.

To unsubscribe from this group and stop receiving emails from it, send an email to kivy-...@googlegroups.com.

embryo

unread,

Oct 28, 2019, 9:03:47 PM10/28/19

to Kivy users support

The second mobile's dp(1)==4.

So we have a sufficient spectrum of dp to test..

Elliot Garbus

unread,

Oct 28, 2019, 10:27:03 PM10/28/19

to kivy-...@googlegroups.com

No better way to learn git that to use git.

I’ll put together a short and simple Filechooser test, and we can do some experiments. It will be a few days – I’m all booked up tomorrow.

Just checking – are you familiar with Plyer? It provides hooks to the native filechooser.

From: embryo
Sent: Monday, October 28, 2019 6:03 PM
To: Kivy users support
Subject: Re: [kivy-users] TreeViewNode arrow problem

The second mobile's dp(1)==4.

So we have a sufficient spectrum of dp to test..

--

You received this message because you are subscribed to the Google Groups "Kivy users support" group.

To unsubscribe from this group and stop receiving emails from it, send an email to kivy-users+...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/12ad8aa4-5a04-4ff4-b33b-89540df299fd%40googlegroups.com.

Reply all

Reply to author

Forward