Sunday, 11 September 2022

Sketchware Pro Custom view

Diese Website verwendet Cookies von Google, um Dienste anzubieten und Zugriffe zu analysieren. Deine IP-Adresse und dein User-Agent werden zusammen mit Messwerten zur Leistung und Sicherheit für Google freigegeben. So können Nutzungsstatistiken generiert, Missbrauchsfälle erkannt und behoben und die Qualität des Dienstes gewährleistet werden.


Hello together, 
the first thing I learned on sketchware pro was to create custom dialog. 

Let's begin:
This is a fake oracle app. Type a question in the EditText-View. Click on the Button and a Custom view will be shown with the question and a random Yes/No/Perhaps answer. 

On MainActivity create widgets as shown below. Important is
* the EditText (I give the Id: edit_question)
* the Button ( I give the Id: button_ask) 
all other can you create as you want.

Create now a custom view. I call it: oracle_dialog.xml
Add 
* a VLinear, 
* 4 TextViews 
* and one Button.
Important is 
* the textview2 for the question to show, 
* textview4 for the random answer to show
 * and the button1 for to go back. 
Do the rest as you like.


Now the views are ready:
* Main
* oracle_dialog (custom)

Let's add the component. Go to component tap and scroll down then add a custom dialog (only for Sketchware pro). I give the Id: custom_dialog.

Now we're ready for programming the blocks. Open the MainActivity. Go to the events tab and add the onClick event for the button_ask.

We need two Variables:
* number answer_number = 0 (is for to set the answers: 0=No, 1=Yes, 2=Perhaps)
* String question_text (is set as the text of the EditText edit_question)

Add a if-then-else-block:
If condition is : question_text is empty 
then toast, that there was no question. 
Else (if there was a question) go on...

Now it's time to create the custom dialog
scroll down the block tap click on custom and insert:
* 1x Create 'CustomDialog' from 'CustomView' into Class 'ClassActivity'.
* 1x 'CustomDialog' set cancelable 'boolean'.
* 3x 'CustomDialog' create view with new ID for custom view with type of the view from original ID from the custom view
- create view with id 'question' with type 'TextView' from id 'textview2'
- create view with id 'answer' with type 'TextView' from id 'textview4'
- create view with id 'back' with type 'Button' from id 'button1'
(if Type view don't show a list of view types click 'edit code' and enter the type.)
* 1x 'CustomDialog' show.

But before we show the Dialog we must set the 'answer' TextView. This is depending of the number 'answer_number': 
* if it is 0 set text to No, 
* if 1 set text to Yes, 
* if 2 set to Perhaps. 
See in the picture to do that. I have too set the TextColor and the BackgroundColor different.
 For set TextView to 'answer' do this with 'Edit code'...


If you have problems to specify Custom dialog in the blocks to custom_dialog then go to the Variable tap, scroll down and drag and drop the custom_dialog Variable to every Custom dialog block.



Last we must dismiss the dialog and set the 'edit_question' EditText to ""(empty) by clicking the Button 'back'. To do that we scroll down the View Block to tab and drag and drop the -When 'View' clicked- block after the show-block and set 'View' to 'back' (by 'Edit code')
Insert the 'CustomDialog' dismiss -block and drag and drop the 'custom_dialog' Variable block.
Insert a TextView setText-block. Set TextView to 'edit_question' (by 'Edit code') and the textfield leave empty.


This was it. You can run the app.😊👍


This blog is inspired by the YouTube video from Arab Ware:



No comments:

Post a Comment