Articles

A search interface in a 320×240 touchscreen

In gtk+, open source, Programming, raspberry pi on October 24, 2015 by oli4444

Last evenings I spent some time on my raspberry pi + hifiberry amp + piTFT + squeezebox project. Previously I created the interface to load a predefined playlist, and to control basics like volume and time. I also finished the integration of the display in the top of the Mission 731i speaker and placed the pi and amp inside the box (will post some pictures soon).

gui

This time I wanted to extend the user interface with a feature to search and browse in the mp3 collection. But that immediately raised the question: what kind of interface works best for a small screen size (320×240) and touch input (no keyboard, no mouse)? A possibility was a virtual keyboard with a entry or a combo, but my first mockup in glade resulted in 300×140 pixels just for the keyboard – leaving very little space for the search results. So I tried a treeview so the user can quickly scroll through the results. To reduce the number of results I added a combo with a prefix (a-z0-9) to the top.
search gui
The results work reasonably well, but there are some issues to resolve.

First of all the scrolling in the GtkTreeView is not using “kinetic scrolling” (you can’t scroll like you normally do on a touchscreen) although I enabled kinetic scrolling for the GtkScrolledWindow parent in glade. Scrolling using the scrollbar on the side works, but kinetic scrolling would work better.

Second, most touchscreen users kind of expect the context menu when you hold your finger for a while. I hoped this was automatically translated to a right-click, but that doesn’t work. So I have to find a way now to catch these events for the context menu’s (anybody a hint how to do this?).

The last issue I have is not related to the touchscreen. I have some scaling layout issues, sometimes a multiline label with a long text forces some buttons off the screen.
screenshot
So I also have to find out how ellipsize works with multiline labels.

Advertisements

5 Responses to “A search interface in a 320×240 touchscreen”

  1. If this is gtk3 (which it seems), it looks like the touchscreen driver is not sending touch events, otherwise you’d get kinetic scrolling out of the box. You might circumvent this with the GTK_TEST_TOUCHSCREEN envvar, so things work despite the touchscreen sending only pointer events.

    • tried this with gtk 3.10.8 but that did not work, no kinetic scrolling…

      • Hmm, that’s strange. For kinetic scrolling it should work on gtk+ >= 3.4. What’s the device.get_source() you get for the touchscreen? I guess the GTK_TEST_TOUCHSCREEN check in gtkscrolledwindow.c might fail if it’s anyway detected as “touchscreen” despite not sending touch events.

        Nonetheless, ideally the x11 driver would be fixed to send touch events :).

      • I’ll check that. How to get device.get_source() , use the device in an event handler, and then request the source?

        Could it be that GTK_TEST_TOUCHSCREEN works in C programs but not in python?

        thanks for your help!

      • The touchscreen sends events that have device source GDK_SOURCE_MOUSE. So perhaps this is indeed the issue. The X11 log does mention a touchscreen… So somewhere between the X11 start and the gtk code something goes wrong..

        [ 311.363] (II) Using input driver ‘evdev’ for ‘stmpe-ts’
        [ 311.363] (**) stmpe-ts: always reports core events
        [ 311.364] (**) evdev: stmpe-ts: Device: “/dev/input/event0”
        [ 311.364] (–) evdev: stmpe-ts: Vendor 0 Product 0
        [ 311.364] (–) evdev: stmpe-ts: Found absolute axes
        [ 311.365] (–) evdev: stmpe-ts: Found x and y absolute axes
        [ 311.365] (–) evdev: stmpe-ts: Found absolute touchscreen
        [ 311.365] (**) Option “SwapAxes” “1”
        [ 311.365] (II) evdev: stmpe-ts: Configuring as touchscreen
        [ 311.366] (**) evdev: stmpe-ts: YAxisMapping: buttons 4 and 5
        [ 311.366] (**) evdev: stmpe-ts: EmulateWheelButton: 4, EmulateWheelInertia: 10, EmulateWheelTimeout: 200
        [ 311.366] (**) Option “config_info” “udev:/sys/devices/soc/20204000.spi/spi_master/spi0/spi0.1/stmpe-ts/input/input0/event0”
        [ 311.366] (II) XINPUT: Adding extended input device “stmpe-ts” (type: TOUCHSCREEN, id 6)
        [ 311.367] (II) evdev: stmpe-ts: initialized for absolute axes.
        [ 311.369] (**) stmpe-ts: (accel) keeping acceleration scheme 1
        [ 311.369] (**) stmpe-ts: (accel) acceleration profile 0
        [ 311.370] (**) stmpe-ts: (accel) acceleration factor: 2.000
        [ 311.370] (**) stmpe-ts: (accel) acceleration threshold: 4
        [ 311.373] (II) config/udev: Adding input device stmpe-ts (/dev/input/mouse0)
        [ 311.374] (**) stmpe-ts: Applying InputClass “calibration”
        [ 311.374] (II) No input driver specified, ignoring this device.
        [ 311.374] (II) This device may have been added with another device file.
        [ 311.425] (EE) FBDEV(0): FBIOBLANK: Invalid argument
        [ 311.524] (EE) FBDEV(0): FBIOBLANK: Invalid argument

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: