scrollfunktion ähnlich iPod/iPhone

Hallo zusammen,

hat schonmal jemand probiert die iPod/iPhone Scrollfunktion nachzubauen die ohne Scrollbar auskommt ? Also so, dass man direkt in einer Listbox/Listview oder evtl. auch einem FlowLayoutPanel die Items mit der Maus hoch- oder runter schieben kann ohne rechts die Scrollbar zu benutzen. Idealerweise natürlich mit der schicken Nachlauffunktion vom iPod, d.h. wenn man die Liste schnell "anschubst" sollte sie noch etwas nachlaufen wenn man die Maus / den Finger schonwieder losgelassen hat.

So eine Funktion ist für echte Maus-Anwendungen wahrscheinlich nicht intuitiv zu bedienen, aber für Touchscreen Anwendungen ideal. Denn die Windows Scrollbars lassen sich leider nur schwer grafisch anpassen und haben immer Standardgröße, sind dadurch auf einem Touchscreen mit dem Finger also schlecht zu bedienen / zu erwischen. (Ok, mit WPF ließen sich sicherlich hübsche Scrollbars bauen, aber direkt mit dem Finger die Liste zu verschieben ist trotzdem intuitiver (gilt nur auf Touchscreens)).

viele Grüße
negi

hallo,

ich habe sowas in der art (aber total einfach) mal gemacht.

das Scollen hab ich von:
http://weblogs.asp.net/israelio/archive/2004/07/20/188664.aspx

ist nur mal so eine spielerei gewesen nachdem ich dein Post gelesen habe...

ist noch nicht so richtig schön, da es nicht darauf reagiert wie schnell man mit degrückter maustaste gescrollt hat...aber es ist ein anfang.
da kann man ja mal weiterspinnen.

PS: mit rechterMaustaste Scrollen

Ich mein für sowas hast du an deiner Maus ein Scrollrad. Hab mir mal die Anwendung von veasel angeguckt und sehe für mich darin keinen Mehrwert.
Wie du schon selber sagtest, ist diese Funktionalität fürTouchscreen durchaus sinnvoll und ideal, für normalen PC-Betrieb mit Maus eher ein Hinderniss, da das Kontextmenü ausbleibt.

Grüße Bionic

richtig!!

ist auch nur ne spielerei...

hab ich auch nur gemacht, weil ich den post gelesen hab und ein bißchen in die richtung überlegt hab.

@Bionic,
Ja klar ist das für "echte" Mäuse langweilig. Aber wie gesagt, das ist eine sehr intuitive Eingabemöglichkeit für Touchscreens, vgl. iPod & Co. Für den mp3 Player im Wohnzimmer der einen Touchmonitor spendiert bekommt ist das eine feine Sache.
Ich habe jedenfalls keinen fertigen mp3 Player gefunden der für Touch ausgelegt war.

Die Version von veasel funktioniert ja schon ganz gut. Der richtige Algorithmus für das schnellere oder langsamere Nachlaufen der Liste je nachdem ob die Liste mit der Maus bzw. dem Touch-Finger schnell oder langsam angestoßen wurde ist bestimmt ein ziemliches gefrimmel...

hallo,

vielleicht hab ich mal ein bißchen lange weile und mach weiter...

würde mir das so vorstellen: eigentlich muss er doch nur mitbekommen, wieviele Scrolls in einer bestimmten zeiteinheit gemacht werden und dann muss für kleinere abschnitte der nachlauf festgelegt werden...

wie sind eure ideen?

So würde ich das auch angehen. Wenn man ein FlowLayoutPanel statt der Listbox nimmt kann man den Scrollverlauf über VerticalScroll.Value abfragen. Man müsste nur die Veränderung der Scrollposition in den letzten x millisekunden messen bevor die Maus / Touchscreen losgelassen wurde (MouseLeave). Dann weiß man wie schnell zuletzt gescrollt wurde und kann mit der gleichen Geschwindigkeit weiterscrollen und es dann auslaufen lassen, also langsamer werden.

Auf Code Project gibt es eine Variante des Finger Flicking Modi.
Vll kann der Eine oder Andere damit was anfangen 😉

Grüße Mariusz

das teil ist schon ziemlich cool!! jedenfalls das video.

da müsste man dann nur noch das auslaufen einbauen...

ich finde dies eine coole idee jetzt müsste man doch einfach noch diese Zahl vom Timer dynamisch machen also z.B. die Differenz der Y-positionen wenn Rechte Maustaste gedrückt wird und wenn sie losgelassen wird und das dann teilen durch die Zeit in welcher das gemacht wurde und dann noch einen angemessenen Multiplikator finden.
kann mir da jemand weiterhelfen wie man das machen würde?
ist dies überhaupt möglich da er ja die zahl ausrechnen muss gleich nachdem die rechte Maustaste losgelassen wird aber diese ausgerechnete Zahl auch gleich zu diesem Zeitpunkt benötigt?

hallo,

ich denke mal ganz so einfach kannst du dir das nicht machen...denn wenn du zum beispiel scrollst und dann zum lesen langsamer wirst und dann anhältst oder nur noch ganz langsam scrollst und dann los läßt, willst du ja nicht noch 30 einträge scrollen.

ich denke die sache ist dann schon etwas komplizierter...

naja sobald du langsamer wirst wird ja die zahl kleiner und es scrollt nicht mehr soweit also genau das was ich möchte
nehmen wir an die differenz der Y-positionen ist 100 und du brauchts eine zeit von 5 dann ergibt das 20 wenn du nun für die gleiche differenz eine Zeit von 50 benötigst da du noch am lesen bist dann ergibt dies nur noch 2 (dies sind nur Beispielwerte)
naja mein Problem ist höchstens das ich nicht genau weiss wie ich das programmieren kann xD

dann müsste man aber die zeit zwischen den Scrollaufrufen berechnen und nicht zwischen button drücken und dann wieder loslassen, oder?

EDIT:

ne ist quatsch... ich versuch das gerade mal einzubauen.

hmm wieso?
du drückst ja dann scrollst du und dann lässt du wieder los, das ist doch die zeit die benötigt wird. Man kann es ja vom gesammten scrollvorgang nehmen da ja das 'nachscrollen' erst danach kommt und vom gesammten abhängig ist

so veasel ich hab dein programm mal ein bischen erweitert
ist zwar nicht ganz perfekt aber probiers aus ist noch ganz lustig xD

hey,

ich finde es toll was aus einer kleinen spielerei werden kann.
Kann das jemand mal auf nem TouchScreen testen. habe heute leider keinen hier.
versuch morgen mal an den tabletPC von nem Kolegen ranzukommen.

finds aber schon richtig cool.

jetzt müßte man das nur alles noch ein bißchen schick zeichnen.

EDIT:
die richtungen haben nicht gestimmt. hab das mal geändert. und ich hab ein Enum für die ScrollRichtung eingeführt. ist ja schicker als ein int.

naja das mit den richtungen kann man sehen wie man will ich weiss ja nicht wies beim iPhone ist da ich noch nie eins in der Hand hatte, aber beim LG "iPhone" ist es so das wenn du es nach oben schiebst dann scrollt es nach unten was ich auch logischer finde 😜
Man kann im Programm ja sehr einfach das einstellen was einem gefällt 😁

P.S. du hast noch die if(count > 0) abfrage entfernt welche ich noch sehr gut finde da es ansonsten jedesmal wenn du sehr langsam oder wenig scrollst noch eine Zahl weiter springt.

mit den richtungen könntest recht haben 😮)
ups, wegen den count=0...

muss dann wieder eingefügt werden.

Hi,

ich hab noch einen super Codeschnipsel auf codeproject gefunden den ich euch nicht vorenthalten will...

Implementing a smoothly animated ListBox
http://www.codeproject.com/KB/list/SmoothListBox.aspx

Introduction

This article shows how you can implement a smooth list box that allows intuitive, friction affected, scrolling of the list items.
By friction based I mean that the user can apply a dragging force i one direction and the list will keep scrolling after the mouse or stylus is released and then slow down by itself.
I've looked at how lists behave on the iPhone and tried to mimic that to a certain extent, but I'm nowhere near anything as cool as what the iPhone presents.

The properties of the iPhone list box that I think are the neatest are the fact that you do not scroll it using a scrollbar but rather just grab the list items and drag them, much neater.

Also, on the iPhone, one is allowed to scroll beyond the bounds of the list box and the items just snaps back into place. Very cool.

Gruss