2014년 12월 9일 화요일

No ORANGE border on text input


Is there a way to remove the orange border on a text input ????
or make it same as background color ?
(like text input on WhatsApp)
cant find anything about this.

--
No, you can't modify the borders of a text box in AI.  You CAN use a canvas, make a rectangle, Make a smaller rectangle inside of that and use the DrawText block to put your text in there...

 Seems like a LOT of effort...

--
mmm than its not a text input :-)

ok i have to live with that then i think?

Is it behavior of AI2 or android ???

Other apps have no (focus) border
in chrome etc.. its possible to kill the focus border by javascript.

is that possible in android too ?

--

작성자: 시간: 댓글 없음:

Emergency SMS

This is my first app, it is an Emergency SMS notification app, have a look and let me know what you think. Also, please feel free to give me suggestions on how I can improve it.

Here are the links: 


작성자: 시간: 댓글 없음:

help needed.. appinventor noob

i need to make a basic computer booking service in ai2, however i am new therefore i have no idea what to do. 

it does not have any external database connection. just to work in the app.

when you click on a computer image on a basic image map (not google maps) you can book computers (10 available for example it will display once you press image), i dont need any feedback to anything external.. just numbers going down when i click reserve.. thats all
then i need two buttons, reserve and cancel. once i  have reserved a computer the number will drop. )  


i live in a area where there is limited internet, can you please help. thanks in advance



also i want to put a logo when loading the app, so it takes me to the main screen for booking. this logo will be small and will wait for 3 seconds then opens the app.. 



What you want is possible.   It will take several steps.  The first is to read the AI2 free online eBook   http://appinventor.mit.edu/explore/ai2/tutorials.html   ... the links are at the bottom of the Web page.   It will help teach you to program.  Along with this, do several of the MIT tutorials (beginner or intermediate level) at  http://appinventor.mit.edu/explore/ai2/tutorials.html 

Second step:   Learn all you can about TinyDB   or the File control + csv files,    these two tools are the only storage options you have in an area with limited Internet.  You may need to also work with Lists.   Although your app could be developed without using Lists, you might find them useful was you learn what they can do.

Lists

List of Lists


TinyDB


Step 3:  Learn to use the PhoneCall and Texting components...these are the tool you wil use to make phone calls and/or send a text sms.

Step4  Try some blocks and see what you can come up with on your device or emulator.   Be aware the phone components will not work on the emulator but you can code them there...they just won't make phone calls or send a text.


작성자: 시간: 댓글 1개:

I need help to control wired headset when i connect it

I try to make an app that responds when i connect/disconnect the wired headset, can i do this with AI2?

Probably not.

Why not SteveJG?

Because App Inventor is a beginners tool for programming Android.  It does not have the capabilities of the Java based professional Eclipse and Android Studio compiles that have tools to work with Android hardware.

The tools it has are here:

작성자: 시간: 댓글 없음:

Build apk error


Im trying to save my project to my pc as an apk but i keep getting an error. This is what im getting "Saving","Building","Packaging" then "Server error: Could not build target. Please try again later". The app is basic ,just a test with a few images all together below 1mb and 5 screens. I noticed that im unable to view the images in the emulator aswell. I restarted my PC and Browser and switched to firefox aswell but the same error occurs. Any help?

--
Are you having issues with just the one project or all projects?   It is important to know if there are coding issues on this project or something more nefarious with your project.  Do other projects load on your emulator with their images or is this the only project that is failing to compile the apk?

Restarting and switching browsers sometimes clears simple issues and you did the right thing, yours issues are more serious but probably can be overcome

 I understand you have 1mb images and five screens.  Parts of item #2 still might apply to you.  That your images do not display in 
the emulator may tell us something about the problem.  Are these png or jpg images or something different?   AI2 will not display all image formats.  Did you create or can you create an aia file?  How large is that file?   The 5Mb limit is the size of the code blocks plus images plus sound files etc.   If your aia is over 5Mb or very close to 5Mb, your issue is there.

Do you have BlueStacks loaded on your PC?   BlueStacks creates serious issues for running AI2.

One of the following  probably applies to your code (all may not apply to your code):

1)  You have coding errors in your blocks.  In the Blocks editor, look in the lower left for the yellow and red triangle icons.    If the red icon has a value larger than 0, you have a serious coding error.  Find the block in your code that has a red triangle and fix it.   Red triangles always inhibit creating an apk or running a project in the emulator or possibly creating an aia file. Yellow triangles are more forgiving, however, sometimes, these need to be fixed because they trip an internal warning and you do not get a compile, so fix the yellow triangles too.

2) Your source file (the aia file) is larger than the 5Mb limit allowed in AI2 or you put images or other resources in your Media (resources) that you do not use in the app.  All the images and sounds count toward the 5Mb limit.. You can program apps larger than 5Mb in the browser, but they will not compile and might not run in the emulator or the project may not save as an aia. If this is the case you need to reduce the size of your image and/or sound files.   Most image files can be made quite small by resizing them using a photo manipulation program on your PC to less than 50Kb each.

3)  You might have more than 10 Screens in your app.  AI2 becomes unstable when more than ten screens are used.

4) You might have used a too large image as a Screen icon for your project. Use a size of 48x48 px or 96x96px instead.

5) You did not code the entire project using App Inventor 2.   If you used one of the third-party AI2 clones, you might not be able to load a Project into the AI2 compiler.

6) If you incorrectly modified the project's Manifest files, you may have issues.

7)  Sometimes, if you have LOTS of Layouts on a single screen,  the apk might not compile.

--
i only have 1 project at the moment and theres no errors in blocks. The images on my project are .png should i change it to .jpg? im using these images as buttons linking to my other 5 screens. I have Bluestacks installed on my pc but uninstalled it and the problem still persists. I tried getting the apk from a different PC (No bluestacks on it ) as well and still failed. When i try exporting the .aia ,the browser loads and nothing else happens. 4 5 6 and 7 does not apply.

--
OK.  You can not create either an apk or an aia.

You disconnected Bluestacks.  I understand users also have to kill all running Bluestacks processes.   Do you know how to do that with Ctrl+Alt+Delete and using Task Manager?    You need to find all the BlueStacks processes, highlight them one at a time then press the "End Process" button on the lower right of the Task Manager form.   BlueStacks is a nasty program when on an AI2 development PC though I understand it is an interesting program to run Android apps.

You only have the one project, OK.   I suspect an issue with your code on this project (or all the BlueStack processes are not closed) but cannot confirm that without knowing if other projects work.  Could you create a very simple, small project and let me know if it runs please.

Projects > Start new project  and name it AI2Test or something.

now, drag a button on to the designer screen.

Build> App (save apk to my computer) .... allow a minute or so.   Does that build the Ai2Test project?

jpg or png files both should work fine in your Project.

--
I made a test and it build fine so the error should be with my app. I checked the blocks and found no errors (see attached). Could it be an issue with size? im going to start from scratch without images. Could it be an issue with Bluestacks and the blocks at the time? 


--
We are glad you got your app working again.   BlueStacks and App Inventor 2 do not get along .  BlueStacks creates serious issues with AI2 Programming.  It is important for users that do have BlueStacks installed on their computers that BlueStacks be disabled and not running when you program AI2.  This means all the Bluestacks processes also be closed using Task Manager in Windows and doing other things in Mac/Linux.

***  If you program with App Inventor 2, everyone, please avoid BlueStacks. ***

--

작성자: 시간: 댓글 1개:

BlueStacks -AI2's Worst Enemy

Recently, a large number of emulator related issues reported were tracked to BlueStacks - a normally benign program that allows Android apps to run on a regular computer.

Be aware developers, BlueStacks and App Inventor 2 do not get along .  BlueStacks creates serious issues with AI2 Programming.  It is important for users that do have BlueStacks installed on their computers that they disable it and do not run it when you program AI2.  This means all the Bluestacks processes also be closed using Task Manager in Windows and doing other things in Mac/Linux.  Sometimes, users relate that it is not sufficient to disable BlueStacks, all its running processes must be shut down too.


***  If you program with App Inventor 2, please avoid BlueStacks. ***


작성자: 시간: 댓글 없음:

Can someone tell how to initailise components on other screen?

Hey can anybody tell me how to initailise textbox.text on a screen by value of textbox on other screen?

This is a similar post made today and it has a similar solution:  https://groups.google.com/forum/#!category-topic/mitappinventortest/HhMzkHZYGgY  
작성자: 시간: 댓글 없음:

pl help to reduce redundancy in my tinywebdb got value method

I want to simplyfy my tinywebdb got value method. I want to create list depend upon tag value but I find myself creating end no. of list. That makes my manual work also increase a lot.

Can I get help to simply the process. 




This is an example of how developers can use Lists instead of If..Then blocks to simplify when making many decisions.  If Then blocks work and for many developers are 'easier' to use.  Lists are more complicated, and require more thought to implement.


This demo shows how to use both the IF statements and Lists to populate and use the ListView component to select and display items or text. This is not what you are doing, however List2 is a 'simplification' of what is going on in List1 (Actually, setting up List2 is more complicated but requires less code).

Try some blocks.



I will try the functionality of the given code & revert.


작성자: 시간: 댓글 없음:

Screen with canvas no longer scrolls after orientation changes to landscape

I put together a test case that demonstrates an issue I’m having with an app. I’m testing it on a Nexus 5 with Android 5.0 Lollipop, the latest AI2 on Chrome beta under Ubuntu Linux, and the AI2 Companion.

The app’s screen includes a canvas with a background image dynamically downloaded from a website, such as a webcam feed. The image width should fill the screen, and the image height should be scaled to match the bitmap’s aspect ratio.

The app includes more user interface elements below the image. In the test case I added a button that reloads the image, and a second, dummy button. Here’s the app in the Designer:
And here’s the code in the Blocks editor:
In portrait mode the app works as expected, as in this screenshot:
When I change the phone orientation to landscape, the image, which has the proper aspect ratio, fills the screen width and only part of the image is visible in height, like this:
Despite the Scrollable property being set, however, I can’t scroll the screen to view the bottom part of the image and the buttons below it. I tried several combinations of layouts, ScreenOrientation settings, and canvas Width/Height settings, but the screen still can’t be scrolled in landscape mode. In portrait mode, the screen scrolls fine with a large image and more user interface elements than fit in the screen.

Is it possible to get the intended scrolling behavior? If so, how? Also, is there any way of preserving the aspect ratio of a canvas background image -- e.g. some settings -- without adjusting it in the code?



When a Canvas fills the entire width of a screen, it is impossible to scroll. The Canvas does not recognize scrolling of the page. Whether you call that response a feature or a bug, the way it is Paolo.  The way I handle this feature is to put some code in the  BackButtonPressed to hide the image temporarily.  Another way is to put the Canvas in a Layout and to only allow the Canvas to fill part of the screen Width ...with margins on both sides of the Canvas, you then CAN scroll, using the white areas.   Be aware, some HUGE changes are coming to AI when AI2 switches from Android API 3 to API 4 ..hopefully before the end of the year...so perhaps the Wizards will deal with this feature/bug then.

Instead of coding landscape, I find apps work better coding Default or Sensor, unless you really have to use landscape.



Thanks for the suggestions Steve. Knowing the actual behavior does help, regardless of whether it's a bug or a feature.

I misunderstood the Sensor setting of ScreenOrientation. What I actually mean is probably Unspecified, or possibly User. I'd like the app to adapt to the user's preferred orientation, i.e. complying with the system orientation setting.

As for the upcoming API change, do you mean AI is going to support Android 4.x and later? Cool.


Yes, API 4 is coming.    At the moment, there are still lots of bugs.  A test version is being evaluated-a painful exercise.  

Coming when?   Originally, the Wizards thought it would be done by now.  This is a difficult task and the Wizards are making considerable progress.  Their concern is the new version work bug free; so API 4 is not going to be available until the bugs are worked out.    The preliminary version still has issues.  I expect Tablet users are going to be very happy from what I see so far... but it is not ready for prime time.



Do you mean Android API Level 4 (Android version 1.6 Donut) or Android version 4 Ice Cream Sandwich?



API 4 has the Tablet permissions    so both, initially all you will get is ability to more graciously design for both phone and tablet screens.


작성자: 시간: 댓글 없음:

how to import/parse text into my app from an other website


i'm making a radio app, all the basics are working now, only i want to see what track is playing when i'm listening to stream.

 I did some reading, it is possible, only i don't understand it. I did see some examples about parsing text, only can't find it any more, forgot to save the page and still did not understand how to use the blocks. I cloud reproduce something when i see how to, but it is difficult for me to fill in de dots .

 on our webpage Freeminded FM i have an url where i can find the stream info.

 http://www.freemindedfm.nl/stream/info.html

 this is how the info looks:  31126718|1|1|0|Online|AutoDJ|Kevin Holdeen - Dancing Days Podcast 89     i underlinded the part that i whant to use

     <head></head>
    <body>

         31126718|1|1|0|Online|AutoDJ|Kevin Holdeen - Danci…

     </body>

 </html>

 How can i get this info into my app. Can somebody give me some pointers, i would really appreciate this.

--
Perhaps use the split at first  text   at block

where |AutoDJ|Kevin Holdeen - Danci…

     </body>


|AutoDJ| is the at   puzzle piece      and    trim  where |AutoDJ|Kevin Holdeen - Danci…

     </body>    is the text

The do a DoIt and view the result.   That coding will get you part of what you need, then you need to manipulate the resulting text using the other Text control options.

Try some stuff.

 --


hey Steve, thanks, well my first problem was how to get the info from http://www.freemindedfm.nl/stream/info.html  into my app , don't know what blocks to use, that is my first problem and the second how to get the last piece of text, but i can make an extra webpage where only the track info is shown. So it;'s more about how do i get text into my app from another url.  i want the track info to get on the Now playing info in the picture when i press play, so how do i get it there, i know it's a lot to aks.

--
Set to html page only text what you need (Artist - Song name)

Sample aia in attachment.


--
Whoohhh  :-) thats very nice, that works :-) Thank you, does that also work when i use an image, so you can aslo see the cover art in an other label.

--
Yes you can use Web->GotText also with image. But fist you need correct you image file names in server! 
That mean please remove all spaces because Android not correct it for you.
Browser change spaces to %20 but android NOT!

--
Ok, i will  look into that en make a page on my site with the correct url's, thanks for all the help. 

 --
Hello Peep,

 i used your example app with a image:   http://www.freemindedfm.nl/covers/livedjs/rjmusic.jpg  only i did not get the image into the app, it looks like in the picture.


--
you do not have to download that image, just assign the URL to the image source like this





--
Text can`t be as image :)
Fist insert Image in designer panel and the set Image PictureTo.
Something like this:

--

 The image1.source block, does this exist in app inventor beta 2  (can't find it)  or is this as Peep prants explained in his picture , now i sued peep prants example, but does it mean that i donwload the picture every time and does it cost more mb fort users. 

 --

 It almost works now :-)   only the track title updates but the cover does not update when a new track is playing, the code looks like in the picture, i tried some stuff out, but can't get them both to update.  Any suggestions. 

--
Please move: "Set Image2-Picture to http://www.freemindedfm.nl/app/current_cover.jpg" block to Clock1 Timer :)

--
i was sure i allready tried this solution, butt i just did it again and it works :-)  Crazy .




 i used a different solution, that also worked, but i think your solution is better, ore do you know if this solution usses less resources


One more question.  Is there also a possibilty then when i start up the app that the cover and track title load directly, so you see it directly and not have to wait 10 seconds and after that is done the timer takes over and checks for updates.  

--
Of course :)
Set to screen Init. ->WebGet and set image.

--
really happy with this, works perfectly.  

I tested this app on a few phones ( galaxy 3, 4 and htc one and one plus) and noticed that samsung phone load the stream much quicker in 1 or 2 seconds and htc phones in about 5 till 8 seconds.  So people keep pushing the play button and then it will not function correctly

When you use a text butten for play it turns to orange when you press it and changes back to grey when the stream is active, so you can see that its doing something, like opening the stream.  When i use an image that feature is not working. Is it possible to also let the picture change like when you use a text button or let people see it is loading. 

--
Yes, music loading time depend what is network speed and what network (WiFi ) chip is used in phone. 
My LG phones loading faster then Sony Z series.
Use some logic:)
Some advice:
1. Remove Exit and pause button, it not needed. "back" press usually exit and stream cant be paused.
2. You can also load stream when screen init. then user not need to press "Play" and it hidden when music playing.
3. You can set only one button visible when app play music ) sample i send you by e-mail.

One my sample music app, for song info I use webView component, then I can send some messages to screen or use moving gif files :)


--
Thanks,  i tested it with the same high speed network, all high end mobile phones, don't know the network chip, butt they are different in the phones.

i will look into your tips/file and work on it. i will show you the result. 

--
your example works great

--

I tested your example, only when i am browsing to my phone and go back to my app it starts up a seconden Stream, not all the time butt sometimes, looks Like a bug or something

--
Please select "PlayOnlyInForeground"
Double start is issue only in development mode. If you build app and try install apk in phone it`s play OK in foreground (also stop music when call come in).

--
Thank you

--

 Hello, still having some issues with my app, in general it works fine on 3G network and on home wifi networks, only on some office wifi networks i'm having trouble with my cover.  When the app starts the timer works and does an automatic update. I have 2 timers 1 for the cover and 1 for the track title. on 3g and normal wifi networks it updates perfectly. Only on the office (work) wifi the cover will not update.  The tracktitle does update. so very strange, also happens when i use 1 timer and activate both. i enabled the timer in properties, so not with a block. I also  used a webviewer for the cover instead, only then the tracktitle would not update. This problem is specific for the office wifi and could be a cahce feature of the wifi network. Does anybody know a workaround for this problem. A got a tip  the make the url variable like /current_cover.jpg?74272457 only really don't know how to make app inventor do that :-)

--
I think this problem is wifi network firewall settings or this wifi network use proxy for tracking and logging user statistic and not like refresh same content. That mean if you image file is all time same name, then it`s stored in proxy cache and show all time same picture.

--
Yes, that is the problem, so i tried it out with the webviewer for the cover and it looks like it is working, only it does not work as smoothly, when you startup the app you see the cover form last time and it takes 10 secondes before it updates even with screen initialize. So Mabye i will make a webpage with al of the info in one and then use the webviewer to show it so everything works at the same time. I will keep you posted when it is done

--
@ peep prants Hi can u contact me for a job plz?diez.dieci@gmail.com, I need some informations about your prices so i can tell you more.. ty

--
Still can't get the app bug free. 

 I use a play button to start up the stream, when i press play the play button its hidden and the stop button appears, works good, only when i'm palying the stream and then do other stuff on my phone or i get called and go back to the app the play button appears, only the stream is still running so i should see the stop button. 
So then it is not possible to stop the stream, only by stopping the app with backpress only then i see screen 1 again and can't get out.   So how do i fix the problem with play and stop button, any ideas, i used the example that you showed me. 

--
You can completely remove Play/Stop buttons, and set Back Press to Stop Audio or Exit App.
Use you imagination :)

--

:-)  yes, that's also a good option, only then i will get the same problem with the stream instead of with the button.  Sometimes you will get 2 streams playing, because of the screen initialize function that kicks in and i set my phone back to original settings   ,so no debugging or developer options on my phone and still having does issues. I think that my first version will be an app with a play and stop button so i don't encounter these problems. Thanks for your help.  I will check out your example and see if i have those problems in your app, maybe it's something wiith my phone or android version.  EDIT: i checked out your app, that won't have that problem :-)

--
I acquainted with double stream problem only in development mode. When you app is installed to phone, then it`s must be OK.

--



작성자: 시간: 댓글 없음:

global variable not working in another screen

dear ai forum i am trying to make a quiz with app inventor 2 .So far it works perfectly but when i try to initialize a global  it appears only as local and as a result it doesnt work in other screens.. any help would be appreciated.thank you in advance 

Hi, You can pass the value with" OPEN ANOTER SCREEN WITH START  VALUE" or "CLOSE SCREEN WITH VALUE". In the new opened screen you can obtain the value with "GET PLAIN START TEXT".

Use Francesco's suggestion.     The words "global variable"  do not really mean GLOBAL.   Variables on a screen are only global within the screen.  With AI2, each screen acts as a separate application that can communicate with the other screens (if the developer provides the appropriate code).  Franacesco provide a very good way to share data between screens.  Another way is to use the TinyDB.   Simply, you put a TinyDB on EACH screen in your app that has to be able to use the "GLOBAL" values.  (So, global values are NOT really global at all, only usable in one screen unless declared on another).  If you need one of the values on a second screen, you retrieve it from the TinyDB using the tag under which you saved it in the original screen.

Either use Franacesco's method or a TinyDB.  Both work.


작성자: 시간: 댓글 없음:

inserire un form da compilare (insert a form to fill)

Hello all, I am planning my app company. I do not know how to submit a form (designed on JotForm). I tried it with the starter activity but by entering the url reference page does not open.
You should complete this form and clicking send notification should get me directly on email. Can anyone help?
Also I would like to create a second button that redirects to three different sites (I wish you had the choice to click which is to his interest)

Thank you all for the help.



I do not know how it works but if you JotForm creates a web page you can view in your app with WebViewer. Alternatively you could create the form with tools AppInventor (textbox, listpiker, checkbox, etc. etc.) and:

- Use of google fusion tables is to store data (app inventor provides functions to use them);

- With basic skills in php and mysql, you can create a php page that will store data via url on a mysql db (if you can create free altervista.org ) 
- On AppInventor with the function JOIN you create URL (eg.www.prova.altervista.org/inserisci.php?valore=val1&valore2=val2&valore3=val3 ....) taking different values ​​created by the form;
- Sends data via WEB.GET 


작성자: 시간: 댓글 없음:

Mysql database organization

Ok. I'm a newbie, developing an android app. It will be an online testing app, where the app will load the list of available tests, then the user selects one and the app will load its questions, answers and other datas (haven't decided yet if I should load everything at once or load them as the users choose tests, so this can be question number 1, if you have an advice for me).
Now everything seemed ok, until I had to build the database. I have one table of user information, name surname etc.
A second table has to hold questions, answers, choices, etc.
some tests are multiple choice, some are fill in the blank, so there has to be a tests table.
I will record student answers online, (or reports, like 4 true, 6 false answers, haven't decided yet, too), so I thought I should store them in the user information table, but then I'd have to add as many columns as there are tests.
so overall, there will possibly be performance issues on the server side, and I have no experience with such staff, I decided to if you could give me some advice on these things. In a nutshell, how can I organize the above mentioned information and tables best, and how will I even tie these tables together?



I like vertabelo.com for a free starter data modelling site.
They have good tutorials in their blog.
Their zero-install sharing is good for teams and public criticism.



Starting out with the wrong data model can bog you down terribly,
so I'll give you a small starter model ...

Table name:  Tests
key(s): TestName (text)
Description (text)

Table name:  TestQuestions
key(s): TestName (text), QuestionNumber (Numeric)
Question (text)
Score(numeric)

TableName:  TestQuestionPrompts
key(s): TestName (text), QuestionNumber (Numeric), PromptNumber(Numeric)
Prompt(text)
(A fill-in question would not have any rows in this table)

TableName:  TestQuestionAnswers
key(s): TestName (text), QuestionNumber (Numeric), Answer(text)
(I made the Answer text a key to allow multiple correct answers to a question.
The Answer texts should be stored trimmed of blanks and lower cased for comparison.)

TableName:  Students
key(s): StudentID(text)
StudentName(text)

Table name: StudentTestAttempts
key(s): StudentID(text), TestName (text), AttemptNumber(numeric)
CompletionDate (Date)
Score (numeric)

Table name: StudentTestAnswers
key(s): StudentID(text), TestName (text), AttemptNumber(numeric), QuestionNumber (Numeric)
AnswerGiven(text)
Score(numeric)

This is a pretty flexible and powerful model,
that will let you create and run multiple tests with
fill-in or multiple choice questions, with
varying scores for easy or hard questions.

If you set this up in Vertabelo, it should be
possible to export a MySQL schema.



I'll try those out at once. Thank you for the suggestions.


작성자: 시간: 댓글 없음:

Creating a book


I've been playing with various app creation tools, but I can't seem to find a decent and easy system for what I want to do. I have a word file that contains notes for a course that I teach. What I'd like to do is create some kind of textbook type app for my students. When I enter the text from the document as a label I then can't edit the paragraphs. Would this be better suited to a text box that isn't enabled? Would that also scroll down the page if there was too much information to be displayed at once?

--
It all depends upon who you want to edit the paragraphs.  You probably want to edit the paragraphs yourself, but not allow your students to edit them.

You have many choices, but the first two that come to mind is that you edit the document in word, and make any changes along the way that you want.  Then, whenever the app loads, it reads in the current iteration of the Word doc if it's newer, and then populate a TinyDB with the chapters.  When a student wants to look at, for example, Chapter 2, load it froomthe TinyDB and put it into the label.  If you want formatting, you can use a webviewer, and display the text as HTML, with formatting etc.

See this post by Steve: How to Create App Books by Appinventor?

--
A comprehensive tutorial has been written showing how to do this.   MIT has had it for three months.  The tutorial is called Treasure Island...an eReader.

Direct your question to Josh   jshe...@mit.edu  and he might be able to tell you when that tutorial will be available on MIT's pages.


In the meantime, you best solution is to create an html file of you 'book,'   load the html as a resource and then uses the example provide by Taifun about how to use a WebViewer  to   read the html.

--
Thank you for your reply!

I'll have a play and see what happens. At the very least I now have an idea of where to start. I think webviewer is a better plan than labels as there are tables and images to display as well as just text.

Thank you again for the help,

--
Pardon a dumb question -

How is making this an app any better than just distributing .doc or .pdf files
via your school's web server or thru Google Docs?

If the students have devices to run an app, they have devices
that can run a PDF reader or Google Docs to edit .doc files.

--
Good question! It's partially as a test run for other, more advanced, things. At the moment it comprises of notes for veterinary anaesthesia, but we are planning to add things like drug calculators, equipment check videos, and links to other resources in the future. We are also planning to release it for vets out in practice to use at some point as well, once we have tested it on the students first.

--
Thank Taifun! 

--
hey Rob, if you dont need images or anything special (just use plain text), you could try to use tinywebdb to create a web database where you can create the book. tinywebdb uses a tag and value system where the tag could be the chapter or heading name and the value is the content. if you want like a table of content, you can use a list viewer to show the tags. if you need the data to be persistent, you can combine the tinywebdb with a tinydb so if they are not online, they can still see the info.

basically, this method would allow you to add data to a tinywebdb server that you can edit anytime and would update the data in the app anytime the user goes on the internet.

--
Thank you all for your suggestions. I have created an ebook using this model (i.e individual html page for each chapter and list picker to navigate through chapters) and it works perfect.

But i need inputs on two questions:

i) is it possible to directly search within various chapters (i.e html pages) based on keyword 

ii) can the user add bookmark or save favourite chapters for reading again in the future.

--
A draft version of the Treasure Island eReader tutorial is  here: http://appinventorforfun.wordpress.com/  .    The 'finished' version has been with MIT for months...ask Josh for a copy  by emailing him at   jsheldon@mit.edu   and requesting the Treasure Island links.

------------------------------------------------------------------
@ Raviteja    Regarding 1:   perhaps.  You might be able to do this with the Activity.Starter as an html is viewed on AI2 essentially as a web page.  Try some things, let us know what works?

Regarding 2:   Add a feature to record the current chapter link in a list then save it persistently in a TinyDB.

Lists
Sajal' example: List Blocks On App Inventor

List of Lists


TinyDB
ABG's example Build Your Own DB - Part 1 demonstrates filtering


--
Thank you for your suggestions Steve.

--
A draft version of the Treasure Island eReader tutorial is  here: http://appinventorforfun.wordpress.com/.    
@SteveJG: who is the author of that tutorial?
There is some redundancy in the blocks, which could be simplified, e.g. the link to the html files or the listpicker.afterpicking event...

--
@Taifun     Josh at MIT probably knows.  Why not ask him?
Yes, I noticed in the tutorial there was some redundancy by design.   I bet this could be streamlined but it appeared the author wanted to give users options perhaps and keep the coding simple?

--
keeping the code simple means to avoid redundancy imho...

--
What suggestion you have given to Rob, I am exactly applying in my app. I would like to know how to " yoe u can combine the tinywebdb with a tinydb so if they are not online, they can still see the info.". 

Appreciate your immediate help.

--
Perhaps write the contents of the TinyWebDB to a csv file;  read the csv file with the File component on the Android and import that csv file into a TinyDB on the device.  Synchronization will be a problem (if you change the contents of the TinyDB, it will not appear in the TinyWebDB unless you write the code to do so.  If you want the TinyWebDB to be the 'master' database, every time you use the Android, you will probably want to update the TinyDB to the latest contents of the TinyWebDB.     There is no easy way to synchronize the two.

The next time, it would be better to post your question as a new post bipin.  This thread is primarily about 'creating a book'. not dealing with databases.

Hope this helps.

--
Thanks @Steve...

--
I'd studied the Treasure Island tutorial and currently creating a book app (with 30 over chapters). I'm using a Content html page to navigate between chapters and also include link to the Content html in individual html chapters.
I'm planning to add a feature that will automatically save the last chapter that's being read by a user and when it is launched the next time (in the case the book app was killed or the phone power off), it'll open the last read chapter.
Your suggestion No. 2 above seem to be able to fit my requirement. However, when I tapped on a link in my Content html, I wasn't able to get the new url from Webviewer. Would you be able to elaborate on how to record the current url in webviewer.
I attached here a copy of the draft version of my book app aia for your comment.


--
I am not sure exactly what you want to do.  You  might want to use the  WebViewerViewString    described by Taifun here http://puravidaapps.com/snippets.php#2webviewstring .
webviewstring.aia

 How does the new property Webviewer.WebViewString work?

Since each chapter is an html file, when someone reads a chapter you will probably want to save the currenturl to a TinyDb as they switch between chapters (you would probably have to use a button outside of the WebViewer the user would have to activate or perhaps can do it with code using a Clock event),   then when you need the url of the last chapter, call the saved value with the WebViewer .
You  have to save the  WebViewer.CurrentUrl   ?    and use it as a pointer.   You do not really want to save a copy of the current url but if you did  actually save a copy, you would do it with the File control.

Returning to the last url (chapter) viewed should not be hard if you use a button or a clock event,  You asked " how to record the current url in webviewer."   To do that, I imagine you would probably need an html that you can modify with the File control .. AI does not have an object that allows you to automatically write an html  (you are currently just reading the ones you have in storage)  so you would have to have some text in which you can insert the current url.    You may have a problem ..files in assets cannot be modified, so if you have an additional url that keeps track of the chapter, the tracking url will have to be stored on the SD card (or the card emulator).   If you can figure out how to write to the external url, you would write the currenturl to the url you can modify and use the WebViewer to read that.    I do not know if that can be done where the rewritable url can be accessed .

Did that help?   Try some blocks to see what is possible.   You have the basic switching between chapters and that is working.

--
Don't know if that fits in your case, but it was mentioned by several users in this forum that the webviewer.getcurrenturl block is always late and in most usecases holds the previous url rather than the current.

--
Thank you for your input. I'd try out the webviewstring and the only way I can make it capture the last url is to add a button to put the webviewstring into a variable (which I can later write it into TinyDB). I couldn't figure out how I can dynamically capture the last url (embeded as script in each html), as the user move from one html to the next one, without the user pressing a button to save the url as bookmark.
You mentioned about using Clock event to trigger the saving of currenturl into TinyDB. Do you have any example that you can share?

Also, after seeing Tonl's input, I found out that webviewer.currenturl is able to show the current url, if I use a button to put it into a variable or label (see the blocks i made below). So I can use either the webviewstring or webview.currenturl to record the url as bookmark into TinyDB using a button.

--
To use a Clock component:

Set the Clock.Interval to the number of ms you want to use to check which url the users is currently viewing.    60000 ms is one minute.
In the event handler you could put the name of the currentURL into the TinyDB

call TinyDB.StoreValue    tag  currentURL    value   urlNumber4        or somethingsimilar  

Another way to do it would be to use the File component and save as a text file the value.

When the user restarts the app, use the TinyDB.GetValue to retrieve the currentURL tag   or the txt file (if you used the File control).

You might want to also have a global variable Boolean (true/false) that tracks whether the user wants to save automatically the current page ...You can set that up with perhaps a check box and in the Clock, only set it off if that value is true and to disable the Clock if that value if false.  Then the user has the option of tracking and saving the current url.    You will have to try some blocks.

There may not be a perfect way to save the current url.  

--
I got it working by using Clock event and TinyDB. Thank you very very much for your input and guidance.
I tested with an apk build and got the book app starts with the last read html when I fresh launched the book app again.

When I started to build this book app, I never thought that App Inventor will get me this far, and it's so much easier.

Once again, a big THANK YOU to you.

--

작성자: 시간: 댓글 없음:
피드 구독하기: 글 (Atom)