2017년 4월 12일 수요일

Getting the true SelectionIndex when using the FilterBar in a ListPicker


I've been using the ListPicker.SelectionIndex property to tell which record was selected. I added a FilterBar to be clever, and to my horror the SelectionIndex ends up always being 1, when the user searches for a unique item.  I have a situation where the text in the Elements list *usually* has no duplicates but there is a possibility that it may.  So finding the list item based on the text is suspect.  Is there any way to find the true index #?

--
I added a FilterBar to be clever, and to my horror the SelectionIndex ends up always being 1
I just tested it and it returns the correct SelectionIndex for me regardless of if there are duplicates or not.

Could you cobble together an example that shows this behavior?
It is possible that there is a bug in the AI software and if so I need to submit a bug report.


--
if you have a list with 5 items A,B,C,D,E and you filter for let's say B, you will get the selection index 1 in the end... this is the selection index of the filtered list, which is not the selection index of the complete list...

--
that's exactly what I'm experiencing.  I had been using SelectionIndex to figure out exactly which option the user selected.  I'm kindof at a loss to figure out how to accomplish that now, except to use the Selection text, which I'm uneasy about.  I like IDs.

--
Maybe instead of SelectionIndex, you could use Selection to find out what has been picked??

-- 
Maybe instead of SelectionIndex, you could use Selection to find out what has been picked??
as a workaound this could be done as soon as there are no duplicates in the list...
is this a bug or a fefature?
in my opinion it would be better to get the selection index of the complete list back

--
I still don't see what the issue is.
It worked for me.
Try my example aia project above.

--
click onto the listpicker, then filter for b and pick b, the selection index is 1
other example: click onto the listpicker, don't filter and pick a, the selection index is 1
other example: click onto the listpicker, then filter for d and pick d, the selection index is 1
the selection index doesn't say something about the index of the complete list, and: did the user filter the list of not? so which element did he pick? a, b or d? you don't know that...

--
 a, b or d? you don't know that...
you don't know that only by looking at the selection index
of course you can take a look at the selection...

That's how it should really be.

If your complete list is a,b,c,d,e (c has index of 3) and user filters to c, r you saying that the index should still be 3??

--
If your complete list is a,b,c,d,e (c has index of 3) and user filters to c, r you saying that the index should still be 3??
yes, because currently you can't use the selection index, actually you have to ignore it if the filter bar is enabled...

--
I don't think that sounds right.
I think the question is how does the user intend to use the selection index.
I think the proper way is to use Selection() where it gives the actual value and then comparison can be done to see what has been picked from ListPicker.
Even if list has dup items, then same conditional check would would work for both.

--
I think the question is how does the user intend to use the selection index.
so how can the user use the selection index currently if the filter bar is enabled? 

--
As mentioned before, they should use Selection block.

--
I agree with Taifun, in my opinion it would make more sense to get the index of the complete list returned. It would be more useable.

--
Let's assume the picker has sorting feature.  If the picker is sorted, at runtime by user,  what should happen to selection index?  If original list is a b c d and user sorts in descending,  what should be selection index of d?

--
the selection index should always be the selection index of the original list, in this case 4

--
You can use index in list with the Selection property to return the index of the first match even if there are duplicates.

--
I suppose if the list is sorted, then the index would have changed.
If so, so what?

--
unless the list is linked by index to another list in which case you should probably be sorting an index to the list rather than the list itself.

--
It looks like there are really two questions here.

1. What is SelectionIndex used for?
2. What's wrong with using Selection (perhaps combined with [index in list]) to figure out what was selected
For #1, the way I see it, if you can't rely on SelectionIndex (at least if you have the FilterBar enabled), then why have it? Do we all just want to agree that it should not be used in conjunction with the FilterBar?  Or to Taifun's point can it be made to work with the original list.  As Scott mentioned immediately above, I use the Elements list in conjunction with larger lists so the indexes are synchronized.
Separately, #2 is definitely feasible.  However there remains the possibility of duplicate items in the Elements list.  Granted, in all scenarios that I can think of, it would be due to a bit of sloppy programming, but what's AI for if not to appeal to the amateur?  
I do like the suggestion of retaining the original index when sorting.  I think it would be even more useful if it could have a "hidden" column with reference IDs.  (key-pairs). That would mean that you could really get rid of SelectionIndex since you would have the ability to create a unique index on your own.

--
For index that's just how android works.  If someone knows how to manipulate and update sdk code to change the standard behavior of android, that would be great and please let us know how. 

--
 if you can't rely on SelectionIndex (at least if you have the FilterBar enabled), then why have it? Do we all just want to agree that it should not be used in conjunction with the FilterBar?  
yes, currently we have to say: 
the Selection Index should not be used together with the FilterBar
this is confusing and should be fixed in my opinion...
the selection index should always be the selection index of the original list

--
Please let's take this to open-source forum so that someone can do sdk update and show us how that works. 

--

Notification Message Show


Hello Gentlmen,
I Need some help, Please: 
I am working on an application "Math Book". There are 30 chapters, each chapter has 20 pages. I want a message pops up just when entering a new chapter: telling that you are in chapter 1,2,3 etc.


--
If all Chapters are the same length, just test the page numbers and when it is a multiple of 20 fire the notification, gathering chapter information for the message. You will need a list for this ;)

-- 
Thank you Mr.Carter for your kind reply.
I made a list for showing message of chapters after 20 pages because they have the same quantity of pages.
I tried to build the mathematics to fire notification but I don't know how.
Can you please give some hints.


-- 
OK, I have put together a simple example for you.

Assumes a title notification/page (Page 0) then Chapters every 3 pages. Have setup the swipe to change the colour of the background.

Should give you enough to go on. If you want to preserve the page number a reader has got to, you will need to use a tinydb to save the page.

You could do some clever logic with the counter and the list to keep the length of the procedure down.


-- 
You are a very helpful man. Thank you so much for great job.

-- 
I tested the blocks every things is fine when there is 30 chapters and make compile but when the total is 60 chapters and make compile there is message.:
App Inventor is unable to compile this project.
The compiler error output was
_____Preparing application icon
_____Creating animation xml
_____Determining permissions
_____Generating manifest file
_____Attaching native libraries
_____Copying native libraries
_____Attaching component assets
_____Compiling source files

I have tried so many times to change in blocks but it is the same problem
Can you please find out what is the problem?

-- 
This is too much data to keep in blocks.

Load the chapter_start_pages table from a csv
file in the Media folder.

Keep it as a 2 column csv table:
(starting page number, chapter title)

After loading it as a file then converting it to a table using
the appropriate csv block, it will be available for an easy lookup-in-pairs
block, taking the current page number and looking it up in that table.
If found, return the current chapter title, otherwise blank.

If blank, don't bother raising the Notifier.

You will have to learn how to load your book text and images into the Media Drawer.
There's no way to keep that much text in blocks.

-- 
Thank you Mr.Abraham Getzler
I don't know how to make the blocks because I am a very old man and have lack of knowledge to do that. please help me if you would like.





-- 
See the section on loading a puzzle table in this doc ...

-- 
Yes, Thank you Abraham for this useful subject,
I have made the block but how can I simply it to make it easier and shorter instead of make pChapter in 60 messages.

-- 
I get the feeling you are putting the cart before the horse in building this app.

You are trying to deal with chapter headings before you have dealt with the harder foundation problem
of how you will bring in your chapter text and illustrations.

That problem should be solved first.

Show us three complete chapters in your app loaded through files,
then it would be appropriate time to talk about chapter headings.

-- 
I have done it fine but when I make it empty also message is appeared even if it is blank. How can I make it not shown.





-- 
Catch the result of the lookup in pairs into a variable.
Then test the variable if it is blank.
If the variable is not blank, then
  notify, else do nothing.

-- 
The same problem when I try to catch the result of the lookup in pairs into a variable.
Can you please tell me what to do.


-- 

The same problem when I try to catch the result of the lookup in pairs into a variable.
Can you please tell me what to do


Start by reading what you wrote.

Where is the place where you change the variable blank's value?

And if you never change its value, when will that Notifier ever get called?

-- 
Would you please show me how can I catch the result of the lookup in pairs into a variable And how can I test the variable if it is blank. Because I can't move one step forward.

-- 
Let's start with the most fundamental step, necessary before any progress can be made.

Your variable names are wrong.

The effect of picking a wrong variable name can be catastrophic.

An example ...

You are walking down a dark alley, and you hear a cry for help.
You run and find a man on the ground, bleeding, with a knife in him.
You try to help him, getting bloody, and the police arrive.
They see you and arrest you, over your objections.
It's time for your trial by jury, and the officer in charge is making a label for
your chest, to identify you to the jury and the judge.
The officer has a choice between writing "murderer" and "suspect" on the label.
Do you see the difference this would make to the course of the trial?

So let's get back to the problem, and correct two crimes of nomenclature ...

The variable pairs  should be called page_headings,
because it is a table taking page numbers and translating them into headings.

The variable blank should be called heading because it is the result of 
looking up the heading for the current page number.

So go back and rename those variables, and take a new blocks image,
then look at it with new eyes and see if the new names help you 
see what will need to be done further.

Then come back here.

-- 
I did what you have said. But I don't know what is the next step





-- 
what about 
  set global heading to lookup in pairs...

my suggestion is to first learn the basics...

A very good way to learn App Inventor is to read the free Inventor's Manual here in the AI2 free online eBook   http://www.appinventor.org/book2 ... the links are at the bottom of the Web page.  The book 'teaches' users how to program with AI2 blocks.
There is a free programming course here http://www.appinventor.org/content/CourseInABox/Intro  and the aia files for the projects in the book are here:  http://www.appinventor.org/bookFiles  
How to do a lot of basic things with App Inventor are described here:  http://www.appinventor.org/content/howDoYou/eventHandling  .

Also do the tutorials http://appinventor.mit.edu/explore/ai2/tutorials.html to learn the basics of App Inventor, then try something and follow the
 Top 5 Tips: How to learn App Inventor

You will not find a tutorial, which does exactly what you are looking for. But doing the tutorials (not only reading a little bit) help you to understand, how things are working. This is important and this is the first step to do.

--
In the initialize global heading, set it to blank.
It is meant to be a piece of text, not a true/false value.

In the procedure, insert a new statement BEFORE the if/then test:

procedure pChapter
  set global heading to lookup in pairs ...   (move it from the Notify block)
  if global heading > " " then
    show alert (global heading)
  end if
end procedure

By the way, which tutorials have you done?
Not just looked at, but actually built with your fingers?
Even experienced programmers need to do the AI2 tutorials.

-- 
And follow Taifun's advice!

-- 
Thank you  too much Taifun and Abraham, I will read more tutorial and get more courses to learn about inventor.
I am really appreciate of your help and support me. please I need your help until finish this section.

-- 
I read so many texts about inventor but I could not find an example about this section. Could any one help me,please





-- 
inventor
you should do this now

where do you call procedure pChapter?
and if you want to check for global heading > 0 in your if statement, then I have to following question for you: why do you set the socket "not found" of the lookup in pairs block to an empty string instead of 0?



A very good way to learn App Inventor is to read the free Inventor's Manual here in the AI2 free online eBook   http://www.appinventor.org/book2 ... the links are at the bottom of the Web page.  The book 'teaches' users how to program with AI2 blocks.
There is a free programming course here http://www.appinventor.org/content/CourseInABox/Intro  and the aia files for the projects in the book are here:  http://www.appinventor.org/bookFiles  
How to do a lot of basic things with App Inventor are described here:  http://www.appinventor.org/content/howDoYou/eventHandling  .

Also do the tutorials http://appinventor.mit.edu/explore/ai2/tutorials.html to learn the basics of App Inventor, then try something and follow the
 Top 5 Tips: How to learn App Inventor

You will not find a tutorial, which does exactly what you are looking for. But doing the tutorials (not only reading a little bit) help you to understand, how things are working. This is important and this is the first step to do.

--
I really need help, Please

-- 
Are you sure that Page_No is just a page number ?

In my original example I added "Page: " to the counter. If you left this in your "flung" blocks, your pChapter code won't work.

I have it working nicely

here are the blocks:
-- 
Actually, I make file to read page number from csv as Abraham Said







-- 

I really need help, Please

you might want to elaborate, what exactly happens and what you like to happen instead

-- 
OK, get the app running in an emulator, then use "Do It" on your blocks inside pChapter, this should help you to see where things are going wrong?

Still can't see from the blocks you posted where Page_No is coming from?

-- 
I attached an example which is exactly the same of my project but when flung the page no there is problem I can't fix in this example but in my project there is no problem.
Please help me to know how to show the notification on page 2 and page 4. in my project there are 500 pages and 200 notification.
Thank you so much and I hope to accept the aia 


-- 
Attached is updated one


-- 
Had a look at your example - "chapter.aia"

I was able to make it work with some changes (these are not fixes) so I can tell you what is wrong / not coded correctly

Firstly your blocks to show the images > page1.png etc. You don't need the join block as the full filename is already in the variable.

You also were not calling the procedure pChapter anywhere so i added it to getPage

There is something wrong with the setup for your csv file, so I replaced it with sample blocks. Suggest you leave these in place until you fix everything else

Also you had an uncalled procedure called "start", so I put the setting of the variable nr in the initialize event
pChapter was set up wrong you needed global heading set instead of resetting global page_headings (ABG and Taifun already told you about this!)
To make pages 2 & 4 show the notifier i used the remainder trick, but this is possibly not scalable unless all your new chapter pages will have an even and regular divisor

So hopefully you can see where all your errors lay and you can find fixes for them. recommend you do one at a time, then test until your are sure it is fixed, then move onto the next one. Debugging multiple errors is difficult and time consuming.

Let us know how you get on ;)

-- 
Ok. It works very well as you said.
Thank you so much for your support and help.
What about if I want to read notification from file. Can you please tell me how can I make it works.

-- 
See blocks and attached aia. I created the csv using google sheets, and although they are not used, started with headers for each column

See the output in the message block for the csv

Not sure why your csv didn't want to work.



-- 
FWIW, just tested your csv file and it is working now ;)

--
Thank you so much Tim Carter. It works only first 2 chapter on the same pages but after I continue go next pages, the notification come at wrong pages. Can you please tell what is wrong that I did.


-- 
The remainder blocks test for an even number only, that is why they called the notifier on 2,4,6 and 8.

You will have to devise a test that works for all your page numbers.

One way would be to create another list of the "chapter" page numbers only, then
test the Page_No.text with the "is in list? thing/list" block

So from my previous working example:
There are other ways to do this.

Let us hope we are close to the finish now :)

--
Every things is going fine in emulator. But when I make compiling, there is an error. When I removed the global Page_List, there is no error when making compile. So, I decided to get Page_List from csv file. but it doesn't work at all.

Try making the lists using a procedure and Screen.initialize

Also you have two warnings, you will need to get rid of those.


-- 
Well done. Thank you so much. It works very well. I really appreciate of your kindness and helping people.

--

Help needed with almost finished app.


I've managed to create a Save Picture feature (Although it doesn't save into the Gallery which is an issue for users) , a Load picture function (Issue is it doesn't go back to the app), slider with dot's size, posibility to draw lines. made a color picker on Screen 2.
All it remains now is to be able to draw upon the canvas and use the Pixelation tool(the events are duplicates though ) and to be able to pick color back to Screen 1

I don t think I will make another app after this, I so need to do this, can t wait till I design the visuals... and yet the inability to get this through eats me from inside.

I've attached the project if you have the time please look at it. Thank you!





--
Save Picture feature (Although it doesn't save into the Gallery which is an issue for users) 

use the GalleryRefresh method from the tools extension  https://puravidaapps.com/tools.php
app
remove the Load_Picture.Open method... it does not make much sense to open the listpicker again after picking...

-- 
I see you created the tools palette. Good.
So, like we told you before, you need to use a variable as a "flag" to know what tool the Canvas.Dragged event should use when called.
Let's call that variable SelectedTool.

If the user touches the "PAINT" button, then set SelectedTool to "PAINT".
If the user touches the "PIXELATE" button, then set SelectedTool to "PIXELATE".
Etc, etc.

Now inside the Canvas.Dragged event:
Place an IF block. That IF is going to compare the value of SelectedTool.

IF Global SelectedTool = "PAINT" then
    (place the drawing blocks here)
ELSE IF Global SelectedTool = "PIXELATE" then
    (place the selection tool that selects the area to pixelate)

-- 
And I'm stuck again



-- 
you should clean up your blocks a little bit, remove the unused blocks, fix the red warnings and try again
and if you need help, you might want to explain what exactly does not work...

-- 
To what Taifun said, add this (as a rule actually) NO DUPLICATES! 
There's no way to make an app with duplicate blocks, so eliminate one of them right away.
Then read again what I posted before. 

The IF block you have there is not comparing SelectedTool with anything, so how is the app going to decide what the drag is going to do?
Use the = (equals) block to evaluate if SelectedTool = "PAINT" 

-- 
Was never good at math and logic...
It's complete chaos, I'm  afraid I'll mess up whatever I have done correctly so far



-- 
Do not give up so easily. Learning programming is hard, even with App Inventor.
Start with deleting the empty when Canvas1.Touched block.

Then, what is the global variable SelectedTool supposed to contain? Now, it would be the result of a comparison of two empty things. Maybe it is false, maybe true.

Anyway, in your Canvas1.Dragged block,
if global SelectedTool is true, you will draw a line.
However, when it is false, nothing will happen. Why? You ask in the else (when it is supposed to be false) again if it is true, this can never occur.
Maybe, you just meant to use else?
And maybe get x and get y should have been get currentX and currentY?

-- 
If you are concerned about 'messing -up' , make a copy of your Project using either Project Save As    or  create an aia file.  Then work with the copy and change the copy as much as you want.  If you make a mistake and cannot recover you can then go back to the original version of the Project.  Save copies frequently and you do not have to worry about breaking something.

Change only ONE thing at a time; test the app and if it works like you want save it and go on to the next big change.  This allows you to keep changing things.  In this way, you will learn how things work

We know you want to finish your exciting project but you might want to take a pause and look at some resources to help you learn to use the AI2 tools  A very good way to learn App Inventor is to read the free Inventor's Manual here in the AI2 free online eBook   http://www.appinventor.org/book2 ... the links are at the bottom of the Web page.  The book 'teaches' users how to program with AI2 blocks. Most beginning AI programmers learn new skills by doing a lot of the available tutorials..not just reading them but building the projects.

There is a free programming course here http://www.appinventor.org/content/CourseInABox/Intro  and the aia files for the projects in the book are here:  http://www.appinventor.org/bookFiles  

How to do a lot of basic things with App Inventor are described here:  http://www.appinventor.org/content/howDoYou/eventHandling  .

Does this help you program?    Please continue to ask questions here however if you read the information above, you will not have to wait for answers.

Just try some blocks and have fun.

-- 
Maybe this will get you started: a little app that draws either circles or lines on the canvas.





-- 
Still not good, it only pixelates.
It's hard, English is not my first language too so I can get lost in translation...

-- 

What are you thinking??

initialize global SelectedTool to (true = false)  ??
The comparison, question, whether true is the same as false is certainly false, So you could have said: initialize global SelectedTool to false

Then, if (Draw.Enabled = Draw) will always be false. Why? I assume Draw is a button, enabled means you can press the button, enabled = false whould mean you cannot press the button. Its value can only be true or false, never "Draw", so the question is false. As a result, you will never draw a line.
The else if part cannot be true either, because the SelectedTool was false, so you will never draw a circle.

I know, English is hard. It is not my mother language either. But if you try to learn more of it, it will help your career very much. Keep trying!
It will also really help if you try to do a few tutorials. For your current problems, I would recommend:
http://www.appinventor.org/bookChapters/chapter18.pdf

Finally, the blocks you posted are not enough to understand what you really want to do. Please post ALL your blocks, and/or an .aia file. I will take a look and correct it.

-- 
I took a look at your new avatar picture and your new nickname.
You must change this NOW, to something appropriate, or I will ban you from the forum.

-- 
Yes, you assumed right
Draw is a button
Pixelate is a button also

Now if I drag my finger across the screen it shows a line being drawn but as soon as I lift it, the pixelation effect applies.




-- 
Good you did edit your profile. Since I know where your new name came from, I still think it is disgusting, but I hope no one else noticed.

So, now it works? I suppose not, because it is unclear to me how you can draw a circle:
 if you click the draw button, it will be disabled.
Then, if you drag the Canvas, the if condition will be true.
Then: you set global SelectedTool to false and Draw.Enabled to false also (because SelectedTool is now false) But it was already false, becasue you tested that for the if.
you will draw a line now, that is fine if that was what you want.
else (Draw was enabled) you check if SelectedTool is true. Did you set it to true somewhere else?? Otherwise it is not possible to draw a circle.

-- 
The functions don't work as intended. Maybe the pixelation tool is interfering?

Attached the apk and aia






-- 
Please, do not attach .apk's!! It is against forum guidelines. I removed it.

-- 
I made some minor adjustments, but I cannot continue, because I have no clue what you want.
I understood that when the Draw button is pressed, you want to draw a line.
The reason that does not work, is that the Canvas.TouchUp event occurs after the Canvas.Dragged event. In the TouchUp you clear the canvas (on which you just have drawn something, which is now gone) and then you pixelate something. This can be prevented by putting a test if Draw.enabled (the Draw button is not pressed) before the pixelation.

Questions remain:
1. When should Draw be enabled again after it was disabled? I put this in clear, but probably you want it set elsewhere too.
2. What is the purpose of global SelectedTool and when should it be set to true or false?
3. When would you like to draw a circle? Should there be a button for it?
4. What is the purpose of global StartX and global StartY

Answer these questions for yourself and probably you can figure out how to solve this.


-- 
1. When pressing Draw button, only lines should be drawn(preferably circles too). These drawings should remain on the canvas.
When pressing Pixelate button, only pixelation should be possible on the canvas, including the new drawings.

2. I don't know anymore, you confused me. I thought that in order to select Draw tool it should be true and for the selection of tool Pixelate false.

3. Circle should be drawn only when tapping on on canvas and lines only when dragging

4. Those are for the Pixelation tool I think.

-- 
@Boz: Like I said before twice: SelectedTool should have the tool you selected to work with. If you click on the LINES button then SelectedTool should be "LINES". If you click on the PIXELATION button then SelectedTool should be "PIXELATION", etc, etc.

When a canvas event, such as dragging, touch down or touch up is detected, then you know what to do because the variable SelectedTool tells you what TOOL the user SELECTED to work with.

You just have to use an IF to decide what to do based on the value of SelectedTool.

--
the circled blocks are what I've added since Ghica's adjustment
the results are the same


-- 
I am not surprised. Your implementation SelectedTool can only be true or false. That is not helpful. Do as Italo says, answer my questions also, and maybe you can make progress then.
The next week I am not available, and anyway, there is nothing I can do without further information.

--
@Ghica, I think Boz is trying to do something he/she's not ready to do yet. I strongly suggest people not trying to run before learning how to walk. But that's what's going on here evidently.

@Boz: I'm a little short on time lately, but I will prepare a clean example tonight to show you how to make a simple drawing app with

1.free hand drawing
2.lines
3.circles
4.Selected area pixelation
Also, you will have to add a brush size selection and I know you already have a color picker, which you will also need.

Keep in mind, I'm not going to do it for you, just show you the basic "skeleton" of the project because I want to teach you or whoever reads this to find out by yourself solutions to these common obstacles.
If you want to wait, I'll do it when I get home tonight (it's 11:30 am here and I'm in my job). In the meantime, please keep reading the basics of AppInventor (variables, lists, canvas, etc.) and practice those A LOT. You will need it.

-- 
@Italo. You are very right and I hope Boz will take proper advantage of your efforts. I am interested in your example too!
@Boz. Make the best of it, follow Italos's advice: do tutorials and then do something decent with what you learned.

-- 
Ok, let's start. Your blocks honestly are a mess right now, so I suggest you start clean.

This will be the basic structure, on what we will be adding stuff. Please build it and understand what this will do.
On the red Xs we will put the different actions that the dragging on the canvas will do depending on what tool the user is using.
-- 
Let me know when you have this done and you understand what it does.

-- 
Well I get some weird artifact when I use the pixelation tool, see pic.




-- 
-- 
Thanks for noticing

If I click on Pixelate button it applies pixelation effect to whole pic and that's not good. Need pixelation whereever I drag  on the photo
Also when loading a picture to draw upon, I can't draw or pixelate it.

-- 
Well, I thought that was your intention, since you modified the procedure I wrote for you before which did exactly that. At least I see you understand how it works.
Start by removing this, it's no use, unless you want to do a whole canvas pixelation.
We will continue after you fix this.


-- 
Thank you once again for your patience.

A thing I've noticed with the pixelation is that it always starts from the upper left corner and not where I touch on the canvas. Does this have to do with the coordinates x and y?
Same thing with the new event handler ''When Canvas Touched''. I've circled it.
I've removed the pixelation from the IF variable

Do I make another IF variable? This time under Canvas Touched? I add the draw circle and pixelation there? 

-- 
Actually the pixelation procedure starts from where you touch first, the problem is you didn't include the original selection rectangle. Let's fix that.

You can't call the pixelation procedure from the Canvas.Dragged event. That's where we do the selection, remember?
So grab the blocks inside the original Canvas.Dragged solution I made on the previous thread and put those blocks inside the IF SelectedTool = PIXELATION, Inside the new Canvas.Dragged you are working on now.
That's the part that creates the semi transparent rectangle that shows the selection.

Also you need the Canvas.TouchDown and the CanvasTouchUp events.

Inside CanvasTouchDown you need to save the initial x and y of the selection in the global variables StartX and StartY. But ONLY if SelectedTool is = PIXELATION, remember that.
Inside CanvasTouchDown you need to do the actual pixelation by calling the pixelation procedure with the globals StartX,StartY, the current x and y which are the end of the selection. This event will be triggered EVERY TIME you lift your finger from the canvas so you need to do the pixelation ONLY if SelectedTool = PIXELATION.

-- 
I edited the previous reply because I mentioned the CanvasTouchDown event twice.

It should be like this:

Inside CanvasTouchDown you need to save the initial x and y of the selection in the global variables StartX and StartY. But ONLY if SelectedTool is = PIXELATION, remember that.
Inside CanvasTouchUp you need to do the actual pixelation by calling the pixelation procedure with the globals StartX,StartY, the current x and y which are the end of the selection. This event will be triggered EVERY TIME you lift your finger from the canvas so you need to do the pixelation ONLY if SelectedTool = PIXELATION.

-- 
Did I add the circled part in the right place?

In the middle of the screenshot you can see CanvasTouchDown . I'm stuck here though




-- 
You don't set SelectedTool = PIXELATE in the touchdown event. You do that ONLY when you click on the PIXELATE button. That button doesn't really do anything to the image. It only sets the variable SelectedTool to PIXELATE so you know what to do in the other events.
Remember, you do not perform the pixelation on the dragging, you do it when lifting your finger off the canvas (TouchUp), so check your dragging event and see what's wrong there, and take it off.
In the TouchDown event only if SelectedTool = PIXELATE, save the x value of that event into the global variable startX. Do the same with the y value in startY.

We will keep going after those changes.

-- 
Good now?


-- 
Remeber to add the = PIXELATE in the IF block, in the TouchDown event. If you don't put that, then you are asking IF SelectedTool = TRUE, which doesn't make sense  in this case.

-- 
-- 
Boz, please pay attention to what we did before. Did we use the blue "equals" before? No, we didn't. That's because the blue one is to compare numbers only. Do it like we did before.
Also, what's SaveCount for? I don't remember putting that in the original pixelation procedure.


-- 
so I change the get Global SelectedTool to set G STool? but I can't add the =. I haven't done it before

-- 
I don't understand why you changed it from the original one I gave you. Just look at how I did it before and only add an IF SelectedTool = PIXELATE, just like we did before in the Dragged event.
What do you mean "I haven't done it before?", you did it.


-- 


 Did we use the blue "equals" before? No, we didn't. That's because the blue one is to compare numbers only. 


Acts exactly the same as the = block found in Math

-- 
oh thanks, yes I did it...
stuck on second event, I can't call the pixelation procedure, no such option it seems.
-- 
Oops, you are right Taifun. I always thought the blue equals only compared numbers and the green one anything else, including numbers.
I just tested the blue one with text and it works the same. Always learning new things, uh? Thanks for pointing it.

@Boz, you can use the blue one if you like. No difference.

-- 
I can't call the pixelation procedure, no such option it seems.



You really need to keep practicing App Inventor, Boz.

I noticed that block but the sizeofPix and canvas made me reconsider

-- 
Those blocks looks good. Show me the rest of the blocks, please.

-- 
here you go

-- 
are you using several canvas components?
if not, you can replace the advanced canvas blocks (the blocks, which have a component socket) by regular canvas blocks...

-- 
Yeap, Taifun is right. I made the procedure to be used in any canvas you may have in your project, but it's not really necessary.

-- 
Another thing, you are saving the canvas twice.
Remove this block I crossed in red.

-- 
Try these changes and see if it works.


-- 
Did I do good?
Wasn't sure to which IF block should add the call Canvas BackgroundImage to..

The app sometimes lags, might be my bad wifi not sure. It blurs the the canvas when drawing with line and circle and pixelate effect is as you can see the dragging selection remains.

Happy Easter guys!





-- 
The block I told you to add, goes exactly there where I put it. Right after the IF block. It doesn't go inside an IF because it has to be done, no matter what tool you are using.
What it does, is to save the canvas in a temporary file and at the same time set it as the new background, because if we don't do that, when you do the selection rectangle, it will delete the changes you made before.
You put it in the wrong place. Put it where I showed you in my previous image and I think the selection rectangle will not stay after you lift your finger.

To avoid the lag a little and the blur, set your Screen1 sizing to Fixed instead of Responsive.

Try those changes and let's see what's next.

-- 
The sizing was already set to Fixed
Now I put that block separetely from any other blocks but it shows the same problem. The drawings dissapear and the selection rectangle remains

--
I didn't mean "separated" from any block. I said "right after the IF" which means is still inside the TouchUp block. In your last picture is in the right place.

About the blur, It happens because we are saving the canvas as a temporary file and each time the file is saved, the png compression is applied again, lowering the quality of previously compressed sections of the drawing.

I fixed that by switching to Fixed sizing. I don't think there's any other way to do it. If it doesn't fix it for you, then it must be that your device works differently with the png compression in fixed sizing mode.
As a test, please restart your companion and see if the blur still happens in fixed sizing mode.

For the rectangle still showing, try adding a Canvas1.Clear block in the TouchUp event, inside the IF SelectedTool = PIXELATE block, BEFORE the pixelation block. That should restore the Canvas to how it was saved before the selection rectangle was drawn, and the pixelation will be done correctly I think.


--
The pixelation works now.

But blur still happens when drawing line or circle, the lag is noticeable too. And as of lately the clear button isn't working anymore, it doesn't clear the picture of drawing and pixelation.

-- 
The Canvas.Clear block resets the background of the canvas to the latest background image or color set, so to be able to delete the canvas completely, you need to set the canvas background image to " " (a white space) or any string that is not an image loaded in your assets.

The blur and lag, looks like it's a limitation of App Inventor you will have to live with. If there's any MIT developer reading this, maybe they can suggest a workaround or even take a look at the source code to reduce the compression when saving in png format.

Keep trying things and you may come up with a better way to do what you need.


--
Well this is discouraging, chances of that happening are slim I assume, too bad, if the app would have been sucesful, a lot of credit would have went towards this comunity. I guess I'll probably have to ask someone else for help with code experience

Thank you guys for the help so far!

--