[vTutorial] App Inventor - Apps einfach selbst erstellen

  • Antworten:34
  • OffenNicht stickyNicht beantwortet
  • Forum-Beiträge: 215

15.05.2012, 20:01:15 via Website


Willkommen zu meinen VideoTutorials zu App Inventor

by: www.haeretik.com


App Inventor ist ein Plug&Play Konzept zum erstellen von eigenen Android Apps.

Hier entsteht nach und nach eine Sammlung von kurzen und wichtigen Tutorialsrund um das Thema App Inventor.
Angefangen bei der Installation geht es hier über wichtige Funktionen, eigenes Design erstellen bis hin zum fertigen App entwickeln.
Das ganze natürlich im Rahmen von App Inventor, denn nicht alles kann so umgesetzt als wenn man es selbst programmiert.



[05.05.2012] App Inventor Tutorial 1 - App Inventor einrichten
http://www.youtube.com/watch?v=TmSlXEpziBo

Beschreibung:
1: App Inventor einrichten

1. Google Konto erstellen
2. Java installieren
3. App Inventor installieren
4. Fertig!


[05.05.2012] App Inventor Tutorial 2 - Erste Schritte/Walk through
http://www.youtube.com/watch?v=r6WgOTLJDNQ

Beschreibung:
2: Übersicht und erste Schritte

Ein walkthrough durch App Inventor. Die wichtigsten Funktionen kurz angesprochen und das interessanteste Erklärt.


[06.05.2012] App Inventor Tutorial 3 - Neuer Bildschirm und blinkende Buttons
http://www.youtube.com/watch?v=SKhZNHVsudw
Beschreibung:
3: Neuer Bildschirm und blinkende Buttons

Ich erkläre euch hier kurz wie ihr neue Seiten anlegt und darauf zugreif und wie ihr Buttons erstellt die blinken wenn ihr drauf drückt. Außerdem wird gezeigt wie ihr für ein Button ein Icon einfügt.


[09.05.2012] App Inventor Tutorial 4 - Webseite öffnen/Internetseite anzeigen Part 1 [h-blog.tk]
http://www.youtube.com/watch?v=x0ETNp3Gwmk
Beschreibung:
4: Webseite öffnen/Internetseite anzeigen

Ich zeige euch wie ihr mit einem Button euren standart Webbrowser öffnet und darin eine beliebige Webseite.
Zudem erkäre ich wie ihr eine Internetseite direkt in eurer App anzeigen lässt.
Benutzen werden wir dazu ein Label, Button, und den webviewer.

Befehl: android.intent.action.VIEW


[09.05.2012] App Inventor Tutorial 5 - Webbrowser steuern & Elenemte anzeigen/verstecken Part 2/2 [h-blog.tk]
http://www.youtube.com/watch?v=o6vLaD0QQUU
Beschreibung:
5: Webbrowser steuern & Elenemte anzeigen/verstecken Part 2

Ich erkläre wie ihr für den zuvor erstellten Webbroser oder Internetseite "Vor- & Zurückbuttons" einfügt um ihn zu steuern.
Zudem wie ihr Elemente, in diesem Beispiel eben diesen Webbrowser anzeigen lässt und wieder verschwinden. Also per Knopfdruck visible/sichtbar oder invisible/unsichtbar schalten.


[14.05.2012] App Inventor Tutorial 6 - PROCEDURES / openanotherscreen / blinkybuttons [h-blog.tk]
http://www.youtube.com/watch?v=x0ETNp3Gwmk
Beschreibung:
6: PROCEDURES / openanotherscreen / blinkybuttons

Ich bringe euch das Tool "procedures" etwas näher anhand von einigen Beispielen.
Darunter wie ihr einen anderen Bildschirm öffnet und als Feedback für die Betätigung für buttons diese aufblinken lässt.
Procedures sind automatisierte Abläufe. Mit ihnen kann einiges an Arbeitsaufwand eingespart werden.
Man braucht nicht dauernd die selbe Wiederholung von Abläufen erneut im BlocksEditor zu bauen, es reicht auch einmal. Mit Hilfe dieses Tools wird das ermöglicht.
Mehr im Video. Etwas kompliziert zu erklären das ganze ^^


---------------------------

mFg, Haeretik

www.haeretik.com - Deine Tutorials und Reviews rund um Android und das SGS2 und SGS3
anfängerfreundlich - bebildert - videos

— geändert am 16.04.2013, 16:06:08

Jonas HellFlorian Wittenberg

Antworten
  • Forum-Beiträge: 215

17.05.2012, 20:48:16 via Website

[14.05.2012]App Inventor Tutorial 7 - eigene/individuelle Farbe erstellen [h-blog.tk]
http://www.youtube.com/watch?v=77u1F6ZZmvM
Beschreibung:
Haeretiks Blog | Android + SGS2 + Alternative- & Astro News
7: eigene/individuelle Farbe erstellen

Ich zeige euch wie ihr eure eigenen Farben selbst bestimmen könnt.
Da die standart Farbauswahl in App Inventor sehr gering ist gibt es zwei Möglichkeiten seine eigenen Farben zu erstellen.
Dazu benötigt man lediglich die RGB Zahlen der gewünschten Farbe. Diese kann man dann im BlocksEditor eintragen werden oder auch an Hand einer Formel einen "App Inventor Farbcode" errechnen den man wiederum im BlocksEditor einträgt.
Diese 2 Varianten zeige ich euch in diesem Tutorial.

App Inventor Farbcodepalette:
http://beta.appinventor.mit.edu/learn/reference/blocks/colorchart.html

HEX-Code in RGB Umwandeln und andersrum:
http://drpeterjones.com/colorcalc/

Gratis Bildbearbeitungsprogramm:
http://www.chip.de/downloads/GIMP-32-Bit_12992070.html

Formel:
Transparenz * 256 + R = x
x * 256 + G = y
y * 256 + B = z
z - 16^8 = App Inventor Farbcode

Dabei ist eine Transparenz zwischen 0 (durchsichtig) und 255 zu wählen.
16^8 = 4294967296

Beispiel (Trangparenz = 255; R = 160; G = 32; B = 240):
255 * 256 + 160 = 65440
65440 * 256 + 32 = 16752672
16752672 * 256 + 240 = 4288684272
4288684272 - 4294967296 = -6283024


...Euer Videotutorial zum Apps selbst erstellen...
--------------------------
Haeretiks Blog | Android + SGS2 + Alternative- & Astro News

— geändert am 16.04.2013, 16:07:02

Jonas HellFlorian Wittenberg

Antworten
  • Forum-Beiträge: 215

24.05.2012, 15:20:15 via Website

[24.05.2012]App Inventor Tutorial 8 - Passwort geschützter Bereich anlegen [h-blog.tk]
http://www.youtube.com/watch?v=77u1F6ZZmvM

Beschreibung:
8 - Passwort geschützter Bereich anlegen

Ich will euch in diesem App Inventor Tutorial zeigen wie ihr einen Bereich mit beliebigem Inhalt durch ein Passwort schützen könnt.
Nach dem das korrekte und vorher festgelegte Passwort in einer PasswortTextbox eingegeben wurde, erscheint nach dem klicken auf einen Button der vorher versteckte und unsichtbare Bereich.

...Euer Videotutorial zum Apps selbst erstellen...
--------------------------
Haeretiks Blog | Android + SGS2 + Alternative- & Astro News

— geändert am 16.04.2013, 16:07:14

Jonas HellFlorian Wittenberg

Antworten
  • Forum-Beiträge: 215

06.06.2012, 20:53:43 via Website

[05.06.2012]App Inventor Tutorial 9 - Einfache Rechnungen [h-blog.tk]
http://www.youtube.com/watch?v=ROjPZRQjQ1U

Beschreibung:
9 - Einfache Rechnungen

In diesem App Inventor Tutorial schauen wir uns einige rechenarten an und machen auserdem auf ein Fehler in App Inventor aufmerksam.
Im Grunde erstellen wir also eine Taschenrechner App für Android.

...Euer Videotutorial zum Apps selbst erstellen...
--------------------------
Haeretiks Blog | Android + SGS2 + Alternative- & Astro News

— geändert am 16.04.2013, 16:07:23

Jonas HellFlorian Wittenberg

Antworten
  • Forum-Beiträge: 69

09.06.2012, 16:54:20 via Website

Hallo! Vielen Dank für die geile Anleitung!
Ich hab mal ne Frage:
Ich verwende den Webviewer, ist es möglich das bei jedem Link der im Webviewer geklickt wird die Linkadresse ergänzt wird?

Zum Beispiel steht folgender Link im Webviewer:
1http://www.mountainking.info/index.php/termine/details/20-woechentliche-ausfahrt-vorschlag-gesucht
klickt man drauf sollte sich diese Seite öffnen (also ohne Module):
1http://www.mountainking.info/index.php/termine/details/20-woechentliche-ausfahrt-vorschlag-gesucht?tmpl=component
Also ich will das jeder Link mit
?tmpl=component
ergänzt wird - geht das?
Gruß Jürgen

Jonas Hell

Antworten
  • Forum-Beiträge: 215

02.07.2012, 15:18:44 via Website

Ja das geht, du musst einfach ne Rechnung als ausgabe anlechen. also zb. "TextImWebviewer + TextDeinerWahl", dann setzt er den text deiner wahl hinter die im webviewer eingegebene adresse...

[07.06.2012] App Inventor Tutorial 10 - Jubiläums Ausgabe - komplette App erstellen Part 1-3 [h-blog.tk]
App Inventor Tutorial 10 - Jubiläums Ausgabe - komplette App erstellen Part 1/3 [h-blog.tk] - YouTube
App Inventor Tutorial 10 - Jubiläums Ausgabe - komplette App erstellen Part 2/3 [h-blog.tk] - YouTube
App Inventor Tutorial 10 - Jubiläums Ausgabe - komplette App erstellen Part 3/3 [h-blog.tk] - YouTube

Beschreibung:
10: Jubiläums Ausgabe - komplette App erstellen Part 1-3

In dieser 10. Jubiläums Ausgabe schreiben wir von vorne bis hinten eine komplette Android App mit einigen hilfreichen Features die wir in den vergangenen App Inverntor Tutorial gelernt haben.
Wird widmen uns nocheinmal den blinky Button und Webseiten, dem sichern von Bereichen mit Passwörter und einige Rechenaufgaben. Das und mehr im Video...

1: .apk-Datei zum downloaden und auf dem Handy installieren:
http://raum.square7.ch/HaeretiksStore/TUT10JubilaeumsApp_HaeretiksBlog%5bh-blog.tk%5d.apk
2: .zip-Datei als Source für App Inventor:
http://raum.square7.ch/HaeretiksStore/TUT10JubilaeumsApp_HaeretiksBlog%5bh-blog.tk%5d.zip
3: Haeretiks Blog - Die App:
https://www.dropbox.com/sh/1v37dghzcwsh7c7/dYAMuHJQvF/HaeretiksBlog_DieApp


...Euer Videotutorial zum Apps selbst erstellen...
--------------------------
mfg, Haeretik

— geändert am 16.04.2013, 16:07:48

Jonas HellFlorian Wittenberg

Antworten
Gelöschter Account
  • Forum-Beiträge: 1

04.09.2012, 17:46:19 via Website

Deine Tutorials sind echt geil.


Ich habe ine miener App Web View hinzufügt,doch wenn eine Seite geöffnet wird und da z.b ein Video ist dann kann man den Video nicht abspielen :(
Gibt es irgendeine Möglichkeit dass man in Webview Videos und Audio datein abspielen kann?

Ich bedanke mich im voraus.

Antworten
  • Forum-Beiträge: 1

05.09.2012, 23:40:03 via Website

Hallo, ich finde deine Tutorials auch echt super und einfach zu verstehen sind sie auch! Respekt weiter so!!

Ich hab ne frage: Wenn ich einen Web Viewer hinzufüge und das prog. dann fertig ist.. Auf dem Smartphone ist das scrollen so eingeschränkt. also man kann entweder nur rauf/runter oder links/rechts scrollen nicht diagonal od. anders.. Liegt das am App Inventor? Kann man das irgendwie "einstellen"?

MFG

Robert

Antworten
  • Forum-Beiträge: 1

18.01.2013, 17:08:46 via Website

Super Tutorials!

Aber ich bin vergeblich auf der Suche nach einer Möglichkeit Bilder als Buttons zu verwenden um beim Klick auf diese zur entsprechenden Seite zu kommen.

Ich sitze gerade an einer App für mein NAS System um meine Daten via schnellzugriff auf meinem Smartphone abzuspielen und stoße auf 2 Probleme, das erste ist oben gennantes, das zweite ist eine Einbindung von Netzwerkordnern in die App...ich hab leider noch keine idee wie ich das bewerkstelligen soll...

Antworten
  • Forum-Beiträge: 1

01.02.2013, 19:28:38 via Website

Hallo,
bin total begeistet von dieser Methode APPs zu erstellen.
Leider habe ich kein Smartphone aber ein 10" Tablet PC kann
man die Auflösung irgendwie einstellen.
Würde mich auf eine Anwort freuen.
Danke noch mal für die Anleitung in Deutsch bin schon 59 jahre und wir
hatten zu meiner zeit kein Englisch.
gruß Günter

Antworten
  • Forum-Beiträge: 11.649

16.02.2013, 00:05:01 via App

Kann ich damit eine einfache wallpaper app erstellen? Oder auch Icon pack app? Die ich dann ab und an Update? Weil Java oder Eclipse trau ich mich nicht ran^^

Die Warheit schmeckt gut wenn man den Bauch voller Lügen hat! ~Muhammad Ali~

Antworten
  • Forum-Beiträge: 8

25.02.2013, 16:10:57 via Website

Hallo,
ich beschäftige mich seit ca. einer Woche mit der Programmierung von Apps.
Daher ist für den Einstieg der App Inventor schon eine feine Sache.
Da auch ich nicht besonders gut englisch verstehe, finde ich ein deutsches Tutorial sehr lobenswert.
In der Jubiläumsapp ist auch schon fast!! alles drin, was ich gebrauchen könnte. (Mal abgesehen von Optik und Disign, aber das kann ja jeder selbst versuchen.

@Günter.
Leider passen die Apps des AppInventor überhaupt nicht zu den Größen der neuen Smartphones.
D.h. auch die Jubiläumspp füllt den Bildschirm eines neueren Smartphones nicht aus.

Ich habe da mal einige Stunden gegoogelt und das brauchbarste, was ich zu dem Thema gefunden habe, ist der Marketizer.
Der wird eigentlich benötigt, um die Apps zum Appshop hochladen zu können.

Aber dort kann man auch die Screengröße so einstellen, dass der Bildschirm immer ausgefüllt ist.
Da gibt es auf Youtube auch ein Tutorial (leider auch auf englisch). Den Link hierfür habe ich leider nicht mehr, finde ihn aber evtl. wieder.
Übrigens werden die Apps durch den Marketizer nicht automatisch hochgeladen, sondern es werden nur erforderliche Daten damit eingearbeitet.

Gruß
Gerd

— geändert am 25.02.2013, 16:15:09

Antworten
  • Forum-Beiträge: 1

13.03.2013, 15:08:01 via Website

Hey Haeretik, super Anleitung!

— geändert am 13.03.2013, 15:11:05

Antworten
  • Forum-Beiträge: 1

21.05.2013, 15:01:44 via Website

Tolle beispiele, gefällt mir! Ich versuche verzweifelt einen slider so zu stellen, das er die app schliesst sobald man den slider auf max geschoben hat. Ich bekomme es zwar hin das der slider die app schliessg aber der macht das immer sofort sobald man den regler benutzt. Hast du einen tipp? Und gibt es eine möglichkeit einen rss feed sinnvoll in so eine app zu integrieren mit dem MIT Appinventor?

Antworten
Gelöschter Account
  • Forum-Beiträge: 442

27.06.2013, 23:38:36 via App

Warum nicht gleich Eclipse? :)

Hi, bin 13 Jahre alt :D Erstes Android Spiel "Strategic Labyrinth": http://goo.gl/Q0Wbd

Antworten
Gelöschter Account
  • Forum-Beiträge: 1

24.09.2013, 15:30:37 via Website

tolle Tutorials.:grin:

Antworten
  • Forum-Beiträge: 1

05.10.2013, 13:33:27 via Website

Hallo, ich habe eine Frage. Wie kann ich folgendes realisieren.

Ich möchte im Feld Schienentemp. z.B 10 °C eingeben
Im Feld Verspanntemp. z.B 23°C
Jetzt soll bei Temperaturdiff automatisch das Ergebnis erscheinen, in dem Fall also 13 °C

Zum Schluss soll im Feld Verlegelücke folgendes berechnet werden Schienenlänge x Temperaturdiff x Faktor 0,0115

Also zum B.S 120m x 13°C x 0,0115

Kann mir jemand dabei helfen, würde mich sehr feuen

Gruß

Daniel

Antworten
  • Forum-Beiträge: 1

21.10.2013, 09:35:32 via Website

Hallo,

ich habe eine kleine App mit dem App Inventor gebastelt. Ich habe oben ein paar Buttons, welche dann den Inhalt unten drunter per "WebViewer" innerhalb eines "frames" angezeigt werden.

Meine Frage ist nun, wie komme ich, nachdem ich auf einem Button geklickt habe, wieder zurück zum "Startbildschirm"? Also die Anzeige, die gleich nach dem starten der App erscheint?

Lieben Gruß,

Daniel

Antworten
  • Forum-Beiträge: 1

17.12.2013, 18:50:03 via Website

Hallo Leute,

an dieser Stelle erstmal Hallo, da ih neu hier im Forum bin. Ich habe mir vor kurzem ein neues Samsung Galaxy Note 10.1 2014 Edition gekauft, da ich mich auch mal am programmieren auf Tablets versuchen wollte. Ich habe mich dem App-Inventor von Google zugewandt und habe da eine Frage: Ich möchte eine Spracherkennungs-App erstellen und hab dafür fast alles gemacht. Mein Problem ist nur: Ich weiß nicht wie ich im BlocksEditor die Spracherkennung so programmiere, dass diese das, was sie erkennt, direkt in eine TextBox schreibt. Ich hoffe das mir jemand helfen kann. P.S. ich benutze schon die 2.te Version (ai2.appinventor.mit.edu).


LG
Daniel N.

Antworten

Empfohlene Artikel