[How-To] Zooper Widget (Tutorials/listed) [keine Diskussion]

Hallo Zooper-Freunde,

ich eröffne hier nun noch einen Zooper Thread, um im speziellen Tutorials und NUR diese einzustellen. Diskussionen sind hier nicht erlaubt! Einen grossen Dank schon mal an @Kvothe für alle Erläuterungen.

Die Themen werden hier noch extra verlinkt.

Viel Spass dabei!

Andy

LINKS / Inhalt:

• Abfragen mit Bildern und Texten 01
  
• Abfragen mit Bildern und Texten 02
• AnalogUhr 01
• AnalogUhr 02
• AnlalogUhr mit Scheineffekt
• Batteriefüllstand 01
• Batteriefüllstand 02
• Batteriefüllstand 03
• Benachrichtigungen mit Tasker auslesen (Bsp gReader, Thx to Videonauth)
• Fensterln / Löschungsmodus
• FONTS Sammlung XDA (Systemfonts zum Flashen)
• Füllungsmodus Farbe
• GSM Signal
• Iconfonts und ihre Nutzung 01
  
• Iconfonts und ihre Nutzung 02
• Iconsets und ihre Nutzung 01
• Kalendereintrag Show/Hide
• Koordinatenbestimmung mit Zooper (XDA) | Karten dazu
• Lautlos mit Tasker
• Mediaplayer 01
• Mediaplayer 02 (Advanced mit wechselnden Bitmaps oder Text
• Mobizen Win Screening
• Netzswerktärke in Prozentangabe
• Netzwerkstärke als Fortschrittsleiste: Wifi - GSM
• Notificationbar 01 / mit Iconfonts
  
• Notificationbar 02 / Erklärung Hide/Show
• Popup-Widget mit Zooper nutzen
  
• Positionieren (Wifiwidget)
• Sidebar zum Nachbauen
• Statusbar selbstgebaut
• Symbol für verpassten Anruf im Widget
• Tasker - Zooper Variablen (Danke an "jagwar")
• Tasker - Trigger Tasks (Danke an "jagwar")
• Tasker - Benachrichtigungen anzeigen (Danke an "jagwar")
• Tasker - Bluetooth Toggle (Danke an "jagwar")
• Transparente Statusbar mit xPosed (ohne Zooper, aber Super! )
• Wallpaper / Uhrzeit -Kombination / Advanced
• Wechselnde Icons 01
• Wechselnde Icons 02
• Wetterpack für Zooper 01
• Wetterpack für Zooper 02
• Wetterpack für Zooper 03 (komplette Iconssets)
• Wechseln der Hintergrundfarbe eines Balkens / Advanced
• WifiSignal
• Windgeschwindigkeit (km/h anstelle mps)
• Windrichtungen (copy & paste)
• Ziffernblatt mit Zooper. (Thx to Videonauth)

kleines tut für alle analog uhren fans.

das schwierige dabei ist, die uhren richtig zu justieren, das heisst, dass die beiden zeiger sich in der mitte treffen, und sich genau um die achse drehen, wie gewollt. minuten und stunden.

man legt 2 quadrate an.

grosser zeiger:

modulnahme: zeig_gross
verankerung: mittig
koordinaten:
x = 0
y = 0

zeigerquadrat:
farbe: #ffffffff (weiss)
breite: 3
höhe: 65
ecken: 0
aussenlinie: 0
drehung: 0
rundung: 0
unschärfe: 0
verlaufsmodus: nichts

erweiterter parameter:

[r] = [as], da geschwindigkeit der rechteckdrehung = winkelgeschwindigkeit.
[ar] = kreisradius vom kreuzpunkt x,y (hier 0,0);
"ar" ist ein zu schätzender wert, den man probieren muss, bis die linie den koordinatenpunkt trifft.
je grösser die zahl, desto weiter rückt das quadraht des zeigers zum rand der uhr,
je kleiner, desto mehr rutscht das quadrat des zeigers ins "zentrum" und darüber hinaus (der zeiger kreuzt die koordinate).

360 = rundumdrehung = 12std.
60 = minutenzahl
#dm# = minutendefinition



kleiner zeiger:

modulnahme: zeig_klein
verankerung: mittig
koordinaten:
x = 0
y = 0

zeigerquadrat:
farbe: #ffffffff (weiss)
breite: 3
höhe: 35
ecken: 0
aussenlinie: 0
drehung: 0
rundung: 0
unschärfe: 0
verlaufsmodus: nichts

erweiterter parameter:

360 = rundumdrehung = 12std.
12 = stundenzahlzahl
#dh# = stundendefinition (00-23)



uhren mittel"punkt":

modulnahme: pkt_klein
verankerung: mittig
koordinaten:
x = 0
y = 0

punktquadrat:
farbe: #ffffffff (weiss)
breite: 10
höhe: 10
ecken: 7
aussenlinie: 0
drehung: 0
rundung: 0
unschärfe: 0
verlaufsmodus: nichts

ziffern, umrandungen, etc sind dann im anschluss nach belieben hinzuzufügen, wie rashiel es gemacht hat.

ich hoffe, es konnte ein wenig geholfen werden.

ST

Hier ein kleines Tut, wie man sich ein Symbol für z.B. einen verpassten Anruf anzeigen läßt. Das Telefonsymbol soll nur zu sehen sein, wenn ein verpasster Anruf vorliegt. Ansonsten soll man es nicht sehen.

Bitmap hinzufügen-> Bild auswählen (ich nehm gern die Tiny White Icons) z.B. Telefon-> das Bild an die Stelle positionieren wo es zu sehen sein soll, die Größe nach seinen Wünschen anpassen-> „Erweiterte Parameter“

[ox]$#SMCALLS#=0?900$[/ox]

Das heiß: Wenn kein verpasster Anruf da ist, verrücke das Bild um 900 (außerhalb des Widgets) in die X- Achse. Demzufolge ist das Bild nur zu sehen wenn mindestens ein verpasster Anruf ist. Das gleiche kann man natürlich auch für SMS machen, man muss nur „SUSMS“ anstelle von „SMCALLS“ eingeben.

Edith: wenn jemand weiß wie das mit Whatsapp funktioniert, bitte posten. Wäre sehr daran interessiert. Geht wohl nur über Tasker.

Viel Spaß

Tutorial: Wir bauen eine eigene Statusbar mit den wichtigsten Funktionen

Was ihr braucht:
Zooper Widget:
https://play.google.com/store/apps/details?id=org.zooper.zwpro
Tasker:
https://play.google.com/store/apps/details?id=net.dinglisch.android.taskerm
Icon Fonts:
https://www.dropbox.com/s/4cyt2wq2vreozay/AndroidDevIcons-TheFont.zip

sowie Verständis der Basisfunktionen von Zooper/Tasker und etwas Zeit.

Dann gehts los:
Am besten kopiert ihr euch schonmal die Fonts in den Ordner fonts im Zooperverzeichnis auf der Sdcard0.
Dann blendet ihr eure orginale Statusbar aus BEVOR ihr das Widget erstellt, evtl. auch den Dock wenn ihr den nachher nicht haben wollt, sonst verschiebt sich alles wieder.
Wie das geht müsst ihr halt eurem Launcher entnehmen.
Dann erstellen wir ein neues Zooper Widget auf dem Homescreen ich habe ein 5x1 Widget erstellt und positionieren das am oberen Bildrand.
Wir fügen nun ein neues Rechteck ein und stellen die Breite so ein, dass die gesamte Breite des Bildschirms bedeckt wird. Wie dick die Statusleiste sein soll ist euch überlassen, einfach bisschen mit der Höhe spielen. Dann könnt ihr Farben, Verlauf etc. gestalten.
Dann wäre die Leiste schonmal geschafft.
Wenn ihr so ein Schatteneffekt unter der Statusbar haben wollte, dass sie sich "abhebt" macht einfach ein neues Rechteck kopiert alle Einstellungen von dem vorherigen Rechteck dann biegt ihr und dreht das ganze bis die Enden etwas nach oben zeigen und schiebt das hinter die Statusbar bis man es nicht mehr sieht. Dann aktiviert ihr den Schatten und verschiebt den einfach solange nach unten bis nur der Schatten unten rauskommt.
Dann fügt ihr einfach Textfelder ein mit Wetter,Datum, Wochentag, Uhrzeit und positioniert die wo ihr sie haben wollt.
Unter Skalierbare Symbolsammlung findet ihr auch eine Batterie.

So jetzt wirds etwas "komplizierter"

Das Netzsymbol mit Empfangsstärke:

In meinem Beispiel nehme ich 6 Balken.
Ihr fügt 6 Rechtecke ein (Breite ist euch überlassen) und
positioniert die alle auf gleicher Höhe und im gleichen Abstand nebeneinander. Dann macht ihr die Rechtecke immer etwas größer als das vorherige Rechteck das ein Art Treppe entsteht.
Als Hauptfarbe nehmt ihr bei allen ein Grauton.

Erweiterte Parameter:
[c]$#NCSIG#>=1?#ffffffff$[/c] erster (kleinster) Balken
[c]$#NCSIG#>6?#ffffffff$[/c] zweiter Balken
[c]$#NCSIG#>11?#ffffffff$[/c] dritter Balken
[c]$#NCSIG#>16?#ffffffff$[/c] vierter Balken
[c]$#NCSIG#>21?#ffffffff$[/c] fünfter Balken
[c]$#NCSIG#>26?#ffffffff$[/c] sechster (größter) Balken

das wars.

Das Wlansymbol mit Empfangsstärke:

3 Rechtecke übereinander positionieren in der Breite vergrößern und in der Höhe verkleinern. Dann müsste ihr das oberste breiter machen, das mittlere etwas schmaler und das letzte noch schmaler machen und dann müsst ihr jedes Bauteil biegen und drehen, dass es nach einem Wlansymbol aussieht. Am Schluss könnt ihr ganz unten noch ein Kreis darunter setzen. Als Hauptfarbe der Bögen wieder das grau von vorher nehmen.

Erweiterte Parameter:
Großer Bogen
[c]$#NWSIG#>6?#ffffffff$[/c][ox]$#NWSTATE#=2?:900$[/ox]
Mittlerer Bogen
[c]$#NWSIG#>3?#ffffffff$[/c][ox]$#NWSTATE#=2?:900$[/ox]
Kleiner Bogen
[c]$#NWSIG#>=1?#ffffffff$[/c][ox]$#NWSTATE#=2?:900$[/ox]

und geschafft.

Mobile Daten Anzeige:

Zwei Textfelder einfügen und genau über dem vorher erstelltem Wlansymbol positionieren und exakt übereinander.
Text bei beiden bearbeiten zu

#NCCONNS#

Erweiterte Parameter:
[ox]$#NWSTATE#=1?:900$[/ox] erstes Textfeld
[ox]$#NWSTATE#=0?:900$[/ox] zweites Textfeld

Fertig.

So jetzt habt ihr alle Basiskonfigurationen eurer Statusbar.

Erweiterung:

Flugmodus und Bluetooth:

Textfeld erstellen und neben dem mobilen Datensymbol platzieren. Schriftart Android-Dev-Icons-2 auswählen.
Text bearbeiten zu:

$#NCSTATE#=1?9$$#TBLU#=1?w$

nun gehts mit Tasker weiter.

Selber Vorgang wie bei den Whatsappbenachrichtigungen nur dass ihr anstatt Variable addiere, Variable setze zu 1 macht. Der zweite Task bleibt bei Variable setze zu 0 und ihr ändert die Namen der Variablen in %BLU.
Dann macht ihr ein neues Profil -> Status->Netzwerk->Bluetooth EIN
und ordnet eurem Bluetooth ON Task (Variable 1) zu.
Und ein anderes genau wie oben mit Bluetooth AUS und haut bei Umkehren ein Haken rein und ordnet das eurem Bluetooth AUS Task (Variable 0) zu.
So funktioniert das bei mir bis jetzt ohne Probleme.

Hoffe ihr kommt mit den Anleitungen klar.

MfG
Thorsten

Pop-Up-Widget mit Zooper nutzen .... So geht's

Ich erkläre es anhand eines einfaches Widgets, welche nach touch einen Musik-Player öffnet!


Was benötigen wir?

- Zooper Pro
- Pop-Up-Widget

Beides aus dem PlayStore installieren

Nun geht's los:

Anmerkung:
Wegen der tapatalk-User habe ich das Tut in den Spoiler gesetzt, weil es einige Bilder enthält


Viel Spaß

Kurz in eigener Sache:

ich habe heute Nacht eine für mich ideale Lösung gefunden, um mein S3 auf den Desktop meines Windows Arbeitsrechners zu bekommen.

Diese Lösung heisst "Mobizen" und kommt, wie Samsung aus Korea.
Der Vorteil, es wird 1:1 auf dem Monitor abgebildet, und wenn man die Auflösung optimal einstellt, kann man ein richtig schönen grossen Screen für Zooper zum Arbeiten bekommen.

Hier die Links

APK Mobizen: Klick
Win/Mac Setup: Klick

Die App hat sehr viele Möglichkeiten, u.a. auch das Herstellen von Tutorials im WMV Format, um die Screenaktivitaet aufzuzeichnen.

- kleine Nachteile:
Sprachen nur englisch, koreanisch, chinesisch, japanisch (dementsprechend Keyboard layout nur eng., keine Umlaute)
- arbeitet bei nur Wifi etwas träge, wenn man mit dem Smartphone im Inet surft, weil die Bandbreitenüberbertragung meist durch die Mobizen-App genutzt wird, daher ideal bei Arbeiten mit Zooper mit USB.

Ihr müsst halt schauen, ob die App aus dem Playstore sich mit Eurem Smartphone verträgt

Es ist auf jeden Fall sehr viel angenehmer, weil man direkt mit Mouse und Keyboard des Rechners auf dem Screen des Phones arbeiten kann.

Bilder angehängt
Es gibt auch genug Möglichkeiten und Tuts auf der Mobizen Seite in Englisch.

Viel Spass, Andy

Meine Tutorials:

Show notification counts in Zooper with Tasker
Zooper Tasker Variables
Trigger Tasker Tasks from Zooper
Zooper Bluetooth Toggle
Zooper WiFi Toggle
Zooper Airplane Mode Toggle
Show Icons for variable states in Zooper
Zooper GPS Toggle
Zooper Alarm Volume Buttons
Zooper Media Volume Buttons
Zooper Notification Volume Buttons
Zooper Ringer Volume Buttons
Zooper System Volume Buttons
Zooper Silent Mode Toggle
Zooper BBM like unread notification for all apps
Zooper multi-mode Icons with Tasker
Zooper Dynamic Icons
Zooper Countdowns

Kompassdaten für 360° (maxi):

Wind:

$#wcwdir#>=0&&#wcwdir#<11.25?[B]N[/B]$$#wcwdir#>=11.26&&#wcwdir#<33.75?[B]NNO[/B]$$#wcwdir#>=33.76&&#wcwdir#<56.25?[B]NO[/B]$$#wcwdir#>=56.26&&#wcwdir#<78.75?[B]ONO[/B]$$#wcwdir#>=78.76&&#wcwdir#<101.25?[B]O[/B]$$#wcwdir#>=101.26&&#wcwdir#<123.75?[B]OSO[/B]$$#wcwdir#>=123.76&&#wcwdir#<146.25?[B]SO[/B]$$#wcwdir#>=146.26&&#wcwdir#<168.75?[B]SSO[/B]$$#wcwdir#>=168.76&&#wcwdir#<191.25?[B]S[/B]$$#wcwdir#>=191.26&&#wcwdir#<213.75?[B]SSW[/B]$$#wcwdir#>=213.76&&#wcwdir#<236.25?[B]SW[/B]$$#wcwdir#>=236.26&&#wcwdir#<258.75?[B]WSW[/B]$$#wcwdir#>=258.76&&#wcwdir#<281.25?[B]W[/B]$$#wcwdir#>=281.26&&#wcwdir#<303.75?[B]WNW[/B]$$#wcwdir#>=303.76&&#wcwdir#<326.25?[B]NW[/B]$$#wcwdir#>=326.26&&#wcwdir#<348.75?[B]NNW[/B]$$#wcwdir#>=348.76&&#wcwdir#<359.99?[B]N[/B]$


Kompassdaten für 360° (normal):


Wind:

$#wcwdir#>=0&&#wcwdir#<22,5?[B]N[/B]$$#wcwdir#>=22,5&&#wcwdir#<67,5?[B]NO[/B]$$#wcwdir#>=67,5&&#wcwdir#<112,5?[B]O[/B]$$#wcwdir#>=112,5&&#wcwdir#<157,5?[B]SO[/B]$$#wcwdir#>=157,5&&#wcwdir#<202,5?[B]S[/B]$$#wcwdir#>=202,5&&#wcwdir#<247,5?[B]SW[/B]$$#wcwdir#>=247,5&&#wcwdir#<292,5?[B]W[/B]$$#wcwdir#>=292,5&&#wcwdir#<337,5?[B]NW[/B]$$#wcwdir#>=337,5&&#wcwdir#<360?[B]N[/B]$

Mit diesen beiden Werten ermittelt man nun den Ortstspunkt auf einer Karte, die man als Bitmap einfügt.

[ox]$((#LLONG#/180)*{Länge vom ZentralPunkt bis zum Rand auf dem Screen(Breite)})$[/ox]
[oy]$((#LLAT#/90)*{Länge vom ZentralPunkt bis zum Rand auf dem Screen(Höhe)}*-1)$[/oy]

Der Punkt muss auf dem Screen ausgemessen werden, es darf nicht die Originalgröße des Bitmaps genommen werden, welches man einfügt.

Kurze Anleitung Labels statt Icons:
Im 1. Screen sind insg. 5 Widgets. 4x Zooper und 1x Missed It. Die Zooper Widgets umfassen:
1. Tapatalk + WhatsApp
2. Dolphin + Facebook
3. E-Mail + SMS + Telefon + Kontakte
4. Galerie + ES Datei Explorer + Kamera
5. Benachrichtigen (dieses ist von Missed It. Wie die Infos angezeigt werden, sieht man im 2. Screen, Rechts oben "Tapatalk: 17" Das Widget ist 3x2 und zeigt beliebige Apps nach Aktualität.)

Ich habe zuerst das Wallpaper erstellt. Das war ein Vollbild Widget. Hintergrundfarbe Grün (mittlerer Streifen), ein schräg gestelltes schwarzes Rechteck links und ein weißes rechts. Dazu 2 Textfelder. Dieses Widget dann per Screenshot als Bild aufnehmen und als Hintergrund setzen.
Nun Widget 1:
Maße ungefähr ein 3x2 Raster.
1 Textfeld "Tapatalk" (Farbe Weiß), 1 Textfeld "Whats" (auch Weiß) und ein Textfeld "App" (schwarz).
Nach belieben diese Felder ausrichten. Dann über das Textfeld "Tapatalk" ein transparentes Rechteck, welches auf allen Seiten etwas größer ist, als die Schrift. Diesem Rechteck dann mit Modul On Tap unter Apps Tapatalk zuweisen.
Ich habe erst Widget 1 und dann 2 gemacht. Danach das 3. um halbwegs symmetrische Abstände zu erreichen.
Der Rest ist Fleiß.
Als letztes habe ich alle Widgets On Tap auf Disable gesetzt (das Widget, nicht die Module!) damit man beim tippen auf den Screen nicht ständig in Zooper landet.
Zu guter Letzt habe ich noch ein transparentes 1x1 Widget rechts unten in die Ecke gesetzt, nur mit einer Widget On Tap Funktion zur App Screen off & Lock, um über einen unsichtbaren Button das Display auszuschalten.

Das wars.
Bei Fragen, fragt...

Ich habe eine Fortschrittsleiste und die Werte.

Das stimmt aber mal so gar nicht mit der original Anzeige über ein.

Das ist ein Versuch auf einer weiteren homescreen Seite.

Oben ist voll und bei der leiste fehlen fast 35%

Hülft dir der Teil aus meiner Uhr?
(siehe Anlage)
:blushing:

So ich versuche mich an einer uhr.
Bin ganz am Anfang.
Meine Frage hierzu ist wie bekomme ich die Minuten Zahl so hin das sie sich mit der leiste mit bewegt (rote leiste für Minuten)

Bekomme nur hin das sich die Zahl an sich dreht.

Das ist eigentlich kein Frage-Thread sondern einer, um ganze Tuts zu liefern. Quasi eine Beschreibung, wie man es gemacht hat, von Anfang bis Ende. Zum Fragen gibts den anderen Zooperthread... . Steht ja auch in der Überschrift (keine Diskussion)

BTT Please..

So Bild mit Rahmen rund....

Ihr wählt ein widget eurer Wahl,

ihr müsst die Farbe des Hintergrundes anpassen an die Farbe eures Desktops. Bzw wenn das widget farbig sein soll spielt es keine Rolle...

1- bitmap wählen und skalieren.

2-ein Rechteck darüber setzten etwas grosser wie das Bild.
Farbe wie Hintergrund.
Darstellungs modus XOR

3-ein weiteres Rechteck einfügen und Form wählen. Darstellungs modus XOR

4- als Darstellungs modus XOR wählen.

5- ein 3. Rechteck einfügen und einen Rahmen bilden in dem ihr einen wert bei aussen Linien eingibt.

6- die Anordnung der module seht ihr auf dem Bild im Anhang.

Auf gutes gelingen.

Akku Anzeige mit einem sich bewegenden.Punkt (Zahl).

So als erstes setzt ihr euch eine Fortschritts leiste.

Die ist mit min:0 max:100 und der wert ist #Blev# für den Akku stand ...

Das Modul Text einfügen und auch mit #BLEV# belegen .

Einen Kreis je nach bedarf einfügen.

So nun alles was wandern soll müsst ihr mit Parametern belegen. D.h ihr geht für euer Modul Zahl oder Kreis und gebt dort die Werte ein .

Werte vom Versatz d.h wo ist die leiste, x ist (links nach rechts) und y (oben bis unten). bzw. Das Objekt.

Z.b. x Versatz ist -100 und die leiste ist 200 lang .(Beispiel)

[Ox]$-100+((200/100)*#BLEVN#)$[/ox]

Ist das Objekt auch in der y Achse
Versetzt z.b um 18 dann kommt der Parameter [oy]$+18$[/oy] dazu.

Im zweiten Bild seht ihr die Formel zum ersten Bild .

*Die zweite Formel bezieht sich auf eine Änderung der Farbe beim laden .

Die Formel auf dem Bild ist die Formel zu meinem widget. *

Farben und transparents ist jedem seines.

Habt ihr das geschafft so fährt eure Zahl oder Bild oder weis der Geier was ihr eingefügt habt auf eurer Anzeige.

Kurz und knapp hoffe es ist gut erklärt.

Simple Uhr mit Minuten die um die Stunden kreisen.

Ihr wählt eure widget in eurer gewollten Größe.

Alle grössen , Schriftarten und Farben bestimmt ihr selbst.

1. ein Rechteck einfügen und Größe bestimmen.

2. das Rechteck durch die Werte "Ecken" zu einem Kreis formen.
3. einen weiteren Kreis einfügen dieser soll dann um den grossen kreisen . siehe Bild.

4 textmodul einfügen und Minuten anzeigen lassen.

5.bei dem kleinen Kreis und dem Text kommt ein Parameter hinzu dieser geht wie folgt.
[AS]$(360/60*#Dmm#)$[/AS]

Soll heißen 360 grad geteilt durch 60 min mal den wert für "Minuten".
Es kommt noch der Radius da zu
[Ar]75[/ar]

(Das sind meine Werte von diesem Beispiel hier!)

6. wenn ihr das habt könnt ihr noch die Stunden mittig im Kreis platzieren und euer widget mit weiteren Modulen schmücken.