Category: Uncategorized

Powerapps4kids session 20

by Leo Veenstra, posted in Uncategorized

PowerApps4Kids Session 20 is on 26th January 2022. If you miss the session, you can watch on YouTube PowerApps4Kids Channel after about a week – 2nd February 2022. So who’s presenting?

April Dunnam

April Dunnam is presenting a game which has gone viral – Wordle!

Peter le Roux

Peter le Roux is going to present an app that will help people talk about difficult topics – such as politics and religion.

So come and join us today (26th January 2022) later on at 6pm GMT.

Sign up at this page – https://www.powerplatformlearn.academy/live-webinar/powerapps4kids-uk-jan-2022/register

Create Connect 4 in Power Apps

by Leo Veenstra, posted in Uncategorized

If you want to learn how to make Connect 4 in Power Apps, then look no further, this is it explained in a post. It was first played in 1974 and has been played for 47 years.  Read on to find out more on how to make it.

Rules of Connect 4

 The rules for this game are, Connect 4 is a game with 7 columns and 6 rows. This is the game, in a Power App and you will see the game when you press play. On your colour go (it shows which go it is under the label saying ‘current turn’), you need to click one of the buttons that says ‘here’. This will put a circle in that column at the bottom blank circle. the aim is to get 4 in a row. This will make an arrow appear showing which direction four circle are connected. Also, a smile will appear. In addition, a sound will play.

Brackets

In the code for Connect 4, you will find 3 different types of brackets. You will find round brackets, square brackets and curly brackets. Look here to find out what each one does.

() – After the name of a function you put ( and the you have your code, afterwards you put )

[] – List of items, they are also called collections.

{} – Item

Creating your Power App

To create a Power App, you go to make.powerapps.com and log in.

Now, click on canvas app from blank.

Create a name for the app, make sure it is a tablet app and then click on the create button.

This will create a blank screen

Code for the App on start

First, we have to make the grid of different coins in connect 4. This is the board for the game. We create this on the app on start. how you find this is, click on App, go to the dropdown and click OnStart

The code we put in here will create the grid. The code we need to put in here is,

ClearCollect(colColumns,{ColNumber:0,
                         NumberOfPieces:0,
                         Rows:[
                               {RowNumber:0,Row:White},
                               {RowNumber:1,Row:White},
                               {RowNumber:2,Row:White},
                               {RowNumber:3,Row:White},
                               {RowNumber:4,Row:White},
                               {RowNumber:5,Row:White}
                              ]
                        },                  
                        {ColNumber:1,
                         NumberOfPieces:0,
                         Rows:[
                               {RowNumber:0,Row:White},
                               {RowNumber:1,Row:White},
                               {RowNumber:2,Row:White},
                               {RowNumber:3,Row:White},
                               {RowNumber:4,Row:White},
                               {RowNumber:5,Row:White}
                              ]
                        },
                        {ColNumber:2,
                         NumberOfPieces:0,
                         Rows:[
                               {RowNumber:0,Row:White},
                               {RowNumber:1,Row:White},
                               {RowNumber:2,Row:White},
                               {RowNumber:3,Row:White},
                               {RowNumber:4,Row:White},
                               {RowNumber:5,Row:White}
                              ]
                        },
                        {ColNumber:3,
                         NumberOfPieces:0,
                         Rows:[
                               {RowNumber:0,Row:White},
                               {RowNumber:1,Row:White},
                               {RowNumber:2,Row:White},
                               {RowNumber:3,Row:White},
                               {RowNumber:4,Row:White},
                               {RowNumber:5,Row:White}
                              ]
                        },
                        {ColNumber:4,
                         NumberOfPieces:0,
                         Rows:[
                               {RowNumber:0,Row:White},
                               {RowNumber:1,Row:White},
                               {RowNumber:2,Row:White},
                               {RowNumber:3,Row:White},
                               {RowNumber:4,Row:White},
                               {RowNumber:5,Row:White}
                              ]
                        },
                        {ColNumber:5,
                         NumberOfPieces:0,
                         Rows:[
                               {RowNumber:0,Row:White},
                               {RowNumber:1,Row:White},
                               {RowNumber:2,Row:White},
                               {RowNumber:3,Row:White},
                               {RowNumber:4,Row:White},
                               {RowNumber:5,Row:White}
                              ]
                        },
                        {ColNumber:6,
                         NumberOfPieces:0,
                         Rows:[
                               {RowNumber:0,Row:White},
                               {RowNumber:1,Row:White},
                               {RowNumber:2,Row:White},
                               {RowNumber:3,Row:White},
                               {RowNumber:4,Row:White},
                               {RowNumber:5,Row:White}
                              ]
                        },

);

Set(VarCurrentTurn,Yellow)

 The clearcollect creates a list of items, which is also known as a collection.

  • colColumns is the name of our collection because without a name there would be no collection.
  • ColNumber is the column number. We use this to set our grid.
  • NumberOfPieces is how many pieces are in this column.
  • Rows contains the coins and their colour.
  • RowNumber is the location in that column.

The Set function at the end of the above code, is where we are changing a variable, which stores information that you can change.

VarCurrentTurn is our variable that tells the app whose turn it is.

Now, run the app on start by playing the app using the play icon at the top.

Making the connect 4 board visible

We need to create a horizontal gallery on our screen for the columns.

You do this by going to insert like we did earlier and clicking on gallery and selecting horizontal gallery.

Next, make the items property of the gallery to 

colColumns

Now, add another gallery inside the first one. It needs to be vertical. This will be the rows. The tree view in the app should now look like this.

In the items property we will make it

ThisItem.Rows

ThisItem.Rows is all of the rows in one column.

Now go to insert at the top of your screen and click on icon and add in a circle and a rectangle. Make the colour using the Fill property blue for the rectangle and for the circle use the following code

ThisItem.Value.Row

The Row contains the colour that we set earlier. The screen should now look like this.

Adding the Buttons and make them work

We are now going to add a button to the first gallery we made. The text property needs to be set to “here”. It should now look like this.

When the button is pressed we want to add the coin to that column. Then we want to change the varCurrentTurn and increase the number of pieces for the selected column

On the OnSelect code for the button we start with if there are no coins in that column. This means

that the number of pieces is set to zero. For this, we need to write the following code.

If(
    ThisItem.NumberOfPieces = 0,
    Set(
        varUpdatedColumn,
        {
            ColNumber: ThisItem.ColNumber,
            NumberOfPieces: 1,
            Rows: [
                {
                    RowNumber: 0,
                    Row: White
                },
                {
                    RowNumber: 1,
                    Row: White
                },
                {
                    RowNumber: 2,
                    Row: White
                },
                {
                    RowNumber: 3,
                    Row: White
                },
                {
                    RowNumber: 4,
                    Row: White
                },
                {
                    RowNumber: 5,
                    Row: varCurrentTurn
                }
            ]
        }
    )
);
Set(
    varColumnToUpdate,
    ThisItem.ColNumber
);
Patch(
    colColumns,
    First(
        Filter(
            colColumns,
            ColNumber = varColumnToUpdate
        )
    ),
    varUpdatedColumn
);
If(
    varCurrentTurn = Yellow,
    Set(
        varCurrentTurn,
        Red
    ),
    Set(
        varCurrentTurn,
        Yellow
    )
);

To make it work for when there are already coins in the column we need to add the following code to the code above at the top.

If(ThisItem.NumberOfPieces = 5,
    Set(
        varUpdatedColumn,
        {
            ColNumber: ThisItem.ColNumber,
            NumberOfPieces: 6,
            Rows: [
                {
                    RowNumber: 0,
                    Row: varCurrentTurn
                },
                {
                    RowNumber: 1,
                    Row: First(
                        Filter(
                            First(
                                Filter(
                                    colColumns,
                                    ColNumber = ThisItem.ColNumber
                                )
                            ).Rows,
                            Value.RowNumber = 1
                        ).Value
                    ).Value.Row
                },
                {
                    RowNumber: 2,
                    Row: First(
                        Filter(
                            First(
                                Filter(
                                    colColumns,
                                    ColNumber = ThisItem.ColNumber
                                )
                            ).Rows,
                            Value.RowNumber = 2
                        ).Value
                    ).Value.Row
                },
                {
                    RowNumber: 3,
                    Row: First(
                        Filter(
                            First(
                                Filter(
                                    colColumns,
                                    ColNumber = ThisItem.ColNumber
                                )
                            ).Rows,
                            Value.RowNumber = 3
                        ).Value
                    ).Value.Row
                },
                {
                    RowNumber: 4,
                    Row: First(
                        Filter(
                            First(
                                Filter(
                                    colColumns,
                                    ColNumber = ThisItem.ColNumber
                                )
                            ).Rows,
                            Value.RowNumber = 4
                        ).Value
                    ).Value.Row
                },
                {
                    RowNumber: 5,
                    Row: First(
                        Filter(
                            First(
                                Filter(
                                    colColumns,
                                    ColNumber = ThisItem.ColNumber
                                )
                            ).Rows,
                            Value.RowNumber = 5
                        ).Value
                    ).Value.Row
                }
            ]
        }
    )
);
If(
    ThisItem.NumberOfPieces = 4,
    Set(
        varUpdatedColumn,
        {
            ColNumber: ThisItem.ColNumber,
            NumberOfPieces: 5,
            Rows: [
                {
                    RowNumber: 0,
                    Row: White
                },
                {
                    RowNumber: 1,
                    Row: varCurrentTurn
                },
                {
                    RowNumber: 2,
                    Row: First(
                        Filter(
                            First(
                                Filter(
                                    colColumns,
                                    ColNumber = ThisItem.ColNumber
                                )
                            ).Rows,
                            Value.RowNumber = 2
                        ).Value
                    ).Value.Row
                },
                {
                    RowNumber: 3,
                    Row: First(
                        Filter(
                            First(
                                Filter(
                                    colColumns,
                                    ColNumber = ThisItem.ColNumber
                                )
                            ).Rows,
                            Value.RowNumber = 3
                        ).Value
                    ).Value.Row
                },
                {
                    RowNumber: 4,
                    Row: First(
                        Filter(
                            First(
                                Filter(
                                    colColumns,
                                    ColNumber = ThisItem.ColNumber
                                )
                            ).Rows,
                            Value.RowNumber = 4
                        ).Value
                    ).Value.Row
                },
                {
                    RowNumber: 5,
                    Row: First(
                        Filter(
                            First(
                                Filter(
                                    colColumns,
                                    ColNumber = ThisItem.ColNumber
                                )
                            ).Rows,
                            Value.RowNumber = 5
                        ).Value
                    ).Value.Row
                }
            ]
        }
    )
);
If(
    ThisItem.NumberOfPieces = 3,
    Set(
        varUpdatedColumn,
        {
            ColNumber: ThisItem.ColNumber,
            NumberOfPieces: 4,
            Rows: [
                {
                    RowNumber: 0,
                    Row: White
                },
                {
                    RowNumber: 1,
                    Row: White
                },
                {
                    RowNumber: 2,
                    Row: varCurrentTurn
                },
                {
                    RowNumber: 3,
                    Row: First(
                        Filter(
                            First(
                                Filter(
                                    colColumns,
                                    ColNumber = ThisItem.ColNumber
                                )
                            ).Rows,
                            Value.RowNumber = 3
                        ).Value
                    ).Value.Row
                },
                {
                    RowNumber: 4,
                    Row: First(
                        Filter(
                            First(
                                Filter(
                                    colColumns,
                                    ColNumber = ThisItem.ColNumber
                                )
                            ).Rows,
                            Value.RowNumber = 4
                        ).Value
                    ).Value.Row
                },
                {
                    RowNumber: 5,
                    Row: First(
                        Filter(
                            First(
                                Filter(
                                    colColumns,
                                    ColNumber = ThisItem.ColNumber
                                )
                            ).Rows,
                            Value.RowNumber = 5
                        ).Value
                    ).Value.Row
                }
            ]
        }
    )
);
If(
    ThisItem.NumberOfPieces = 2,
    Set(
        varUpdatedColumn,
        {
            ColNumber: ThisItem.ColNumber,
            NumberOfPieces: 3,
            Rows: [
                {
                    RowNumber: 0,
                    Row: White
                },
                {
                    RowNumber: 1,
                    Row: White
                },
                {
                    RowNumber: 2,
                    Row: White
                },
                {
                    RowNumber: 3,
                    Row: varCurrentTurn
                },
                {
                    RowNumber: 4,
                    Row: First(
                        Filter(
                            First(
                                Filter(
                                    colColumns,
                                    ColNumber = ThisItem.ColNumber
                                )
                            ).Rows,
                            Value.RowNumber = 4
                        ).Value
                    ).Value.Row
                },
                {
                    RowNumber: 5,
                    Row: First(
                        Filter(
                            First(
                                Filter(
                                    colColumns,
                                    ColNumber = ThisItem.ColNumber
                                )
                            ).Rows,
                            Value.RowNumber = 5
                        ).Value
                    ).Value.Row
                }
            ]
        }
    )
);
If(
    ThisItem.NumberOfPieces = 1,
    Set(
        varUpdatedColumn,
        {
            ColNumber: ThisItem.ColNumber,
            NumberOfPieces: 2,
            Rows: [
                {
                    RowNumber: 0,
                    Row: White
                },
                {
                    RowNumber: 1,
                    Row: White
                },
                {
                    RowNumber: 2,
                    Row: White
                },
                {
                    RowNumber: 3,
                    Row: White
                },
                {
                    RowNumber: 4,
                    Row: varCurrentTurn
                },
                {
                    RowNumber: 5,
                    Row: First(
                        Filter(
                            First(
                                Filter(
                                    colColumns,
                                    ColNumber = ThisItem.ColNumber
                                )
                            ).Rows,
                            Value.RowNumber = 5
                        ).Value
                    ).Value.Row
                }
            ]
        }
    )
);

Disable the button for full columns

To disable the button for when the column is full, we need to write the following code to the Display Mode property,

If(ThisItem.NumberOfPieces < 6, Edit,Disabled)

Displaying the current turn

Outside of all of the galleries, we add a circle nd on the fill property we put

varCurrentTurn

New game button

Add a new button make the text “new game” and on the OnSelect code, we copy the App OnStart code.

Arrows to signal that the game is done

We need to add an arrow for every possible place that there could be four in a row. In total there are 69 possibilities. As an example, if the four yellow coins are shown as they are above, then add the following code,

First(Filter(First(Filter(colColumns,ColNumber=0)).Rows,Value.RowNumber=5).Value).Value.Row<>White&&

First(Filter(First(Filter(colColumns,ColNumber=0)).Rows,Value.RowNumber=5).Value).Value.Row=First(Filter(First(Filter(colColumns,ColNumber=1)).Rows,Value.RowNumber=4).Value).Value.Row&&

First(Filter(First(Filter(colColumns,ColNumber=0)).Rows,Value.RowNumber=5).Value).Value.Row=First(Filter(First(Filter(colColumns,ColNumber=2)).Rows,Value.RowNumber=3).Value).Value.Row&&

First(Filter(First(Filter(colColumns,ColNumber=0)).Rows,Value.RowNumber=5).Value).Value.Row=First(Filter(First(Filter(colColumns,ColNumber=3)).Rows,Value.RowNumber=2).Value).Value.Row

On the first line, in the grid for column 0 and row 5 we are checking that there is a coin and for the rest of the rows, we are checking that they are the same to column 0 and row 5. Repeat the same just change the numbers for all the other options. You might want to make sure that you name the arrows. I named all my arrows column number _ row number then the direction of the arrow so for example 0_5v or 4_6v

Smiley face to check that there is an arrow visible

when any of the arrows are visible, we want a smiley face to appear. We do this by adding a smiley icon and on the visible property we use the following code.

'0_5 h'.Visible||
'1_5 h'.Visible||
'2_5 h'.Visible||
'3_5 h'.Visible||
'3_4 h'.Visible||
'2_4 h'.Visible||
'1_4 h'.Visible||
'0_4 h'.Visible||
'2_3 h'.Visible||
'3_3 h'.Visible||
'1_3 h'.Visible||
'0_3 h'.Visible||
'2_0 h'.Visible||
'1_0 h'.Visible||
'0_0 h'.Visible||
'2_1 h'.Visible||
'3_1 h'.Visible||
'1_1 h'.Visible||
'0_1 h'.Visible||
'3_2 h'.Visible||
'2_2 h'.Visible||
'1_2 h'.Visible||
'0_2 h'.Visible||
'3_0 h'.Visible||
'5_5 v'.Visible||
'0_5 dr'.Visible||
'0_5 v'.Visible||
'0_4 dr'.Visible||
'1_4 dr'.Visible||
'5_3 v'.Visible||
'4_3 v'.Visible||
'3_3 v'.Visible
||'2_3 v'.Visible
||'1_3 v'.Visible||
'0_3 v'.Visible||
'0_4 v'.Visible||
'1_4 v'.Visible||
'2_4 v'.Visible||
'3_4 v'.Visible||
'4_4 v'.Visible||
'5_4 v'.Visible||
'6_4 v'.Visible||
'1_5 v'.Visible||
'2_5v'.Visible||
'3_5 v'.Visible||
'4_5 v'.Visible||
'6_5 v'.Visible||
'1_5 dr'.Visible||
'3_5 lr'.Visible||
'3_4 lr'.Visible||
'3_3 lr'.Visible||
'6_3 lr'.Visible||
'5_3 lr'.Visible||
'4_3 lr'.Visible||
'4_4 lr'.Visible||
'6_4 lr'.Visible||
'5_4 lr'.Visible||
'5_5 lr'.Visible||
'4_5 lr'.Visible||
'6_5 lr'.Visible||
'2_5 dr'.Visible||
'2_4 dr'.Visible||
'3_5 dr'.Visible||
'3_4 dr'.Visible||
'3_3 dr'.Visible||
'2_3 dr'.Visible||
'1_3 dr'.Visible||
'0_3 dr'.Visible

the two lines, || is the “or” in Power Apps

This should create the game, if you would prefer a video, then watch it below.

Good luck

The New PowerApps4Kids Logo has arrived!

by Rory Neary, posted in Uncategorized

When we first set up PowerApps4Kids we cobbled together a logo, and towards the end of 2020 Microsoft rebranded Power Apps and ours started to look a little out of date.

So here it is – we hope you like it, and we hope you can join us at our next session which will be held on Tuesday 23rd February 6pm GMT

You’ll need to do 2 things:-

  • Sign up for the course/site
  • Sign up for the session
1. Site sign up
2. Session sign up

https://www.powerplatformlearn.academy/live-class/pa4k-europe-usa-11/register


Chess – A PowerApps Project

by Rory Neary, posted in Uncategorized

Say no more.

https://github.com/powerapps4kids/chess

Chess – one of the ultimate board games and one that dates back hundreds of years. We know what it looks like, and I take on the challenge of making it in PowerApps. Practically speaking this is straightforward, but understanding the formulas is pretty complex. Good Luck!

Continue reading “Chess – A PowerApps Project” →

Steps for importing a Power App

by Pieter Veenstra, posted in Uncategorized

There are two types of apps.

  • .msapp
  • .zip

Steps for importing an msapp.
1. Go to https://us.create.powerapps.com/studio/# (see the link below) – you should get redirected to https://eu.create.powerapps.com/studio/# if in Europe
2. Download one of the apps below. The app MUST be of a type *.msapp for this technique to work
3. Go back to the site above
4. Click Open
5. Browse for your file
6. Open it.
7. Nearly there
8. Make sure that you save the app (so that it lives on the web)

Steps for downloading a *.zip file
https://youtu.be/LhGUuB0nGio

Introduce Yourself (Example Post)

by pieterveenstra4kids, posted in Uncategorized

This is an example post, originally published as part of Blogging University. Enroll in one of our ten programs, and start your blog right.

You’re going to publish a post today. Don’t worry about how your blog looks. Don’t worry if you haven’t given it a name yet, or you’re feeling overwhelmed. Just click the “New Post” button, and tell us why you’re here.

Why do this?

  • Because it gives new readers context. What are you about? Why should they read your blog?
  • Because it will help you focus your own ideas about your blog and what you’d like to do with it.

The post can be short or long, a personal intro to your life or a bloggy mission statement, a manifesto for the future or a simple outline of your the types of things you hope to publish.

To help you get started, here are a few questions:

  • Why are you blogging publicly, rather than keeping a personal journal?
  • What topics do you think you’ll write about?
  • Who would you love to connect with via your blog?
  • If you blog successfully throughout the next year, what would you hope to have accomplished?

You’re not locked into any of this; one of the wonderful things about blogs is how they constantly evolve as we learn, grow, and interact with one another — but it’s good to know where and why you started, and articulating your goals may just give you a few other post ideas.

Can’t think how to get started? Just write the first thing that pops into your head. Anne Lamott, author of a book on writing we love, says that you need to give yourself permission to write a “crappy first draft”. Anne makes a great point — just start writing, and worry about editing it later.

When you’re ready to publish, give your post three to five tags that describe your blog’s focus — writing, photography, fiction, parenting, food, cars, movies, sports, whatever. These tags will help others who care about your topics find you in the Reader. Make sure one of the tags is “zerotohero,” so other new bloggers can find you, too.

Introduce Yourself (Example Post)

by pieterveenstra4kids, posted in Uncategorized

This is an example post, originally published as part of Blogging University. Enroll in one of our ten programs, and start your blog right.

You’re going to publish a post today. Don’t worry about how your blog looks. Don’t worry if you haven’t given it a name yet, or you’re feeling overwhelmed. Just click the “New Post” button, and tell us why you’re here.

Why do this?

  • Because it gives new readers context. What are you about? Why should they read your blog?
  • Because it will help you focus your own ideas about your blog and what you’d like to do with it.

The post can be short or long, a personal intro to your life or a bloggy mission statement, a manifesto for the future or a simple outline of your the types of things you hope to publish.

To help you get started, here are a few questions:

  • Why are you blogging publicly, rather than keeping a personal journal?
  • What topics do you think you’ll write about?
  • Who would you love to connect with via your blog?
  • If you blog successfully throughout the next year, what would you hope to have accomplished?

You’re not locked into any of this; one of the wonderful things about blogs is how they constantly evolve as we learn, grow, and interact with one another — but it’s good to know where and why you started, and articulating your goals may just give you a few other post ideas.

Can’t think how to get started? Just write the first thing that pops into your head. Anne Lamott, author of a book on writing we love, says that you need to give yourself permission to write a “crappy first draft”. Anne makes a great point — just start writing, and worry about editing it later.

When you’re ready to publish, give your post three to five tags that describe your blog’s focus — writing, photography, fiction, parenting, food, cars, movies, sports, whatever. These tags will help others who care about your topics find you in the Reader. Make sure one of the tags is “zerotohero,” so other new bloggers can find you, too.

Introduce Yourself (Example Post)

by pieterveenstra4kids, posted in Uncategorized

This is an example post, originally published as part of Blogging University. Enroll in one of our ten programs, and start your blog right.

You’re going to publish a post today. Don’t worry about how your blog looks. Don’t worry if you haven’t given it a name yet, or you’re feeling overwhelmed. Just click the “New Post” button, and tell us why you’re here.

Why do this?

  • Because it gives new readers context. What are you about? Why should they read your blog?
  • Because it will help you focus your own ideas about your blog and what you’d like to do with it.

The post can be short or long, a personal intro to your life or a bloggy mission statement, a manifesto for the future or a simple outline of your the types of things you hope to publish.

To help you get started, here are a few questions:

  • Why are you blogging publicly, rather than keeping a personal journal?
  • What topics do you think you’ll write about?
  • Who would you love to connect with via your blog?
  • If you blog successfully throughout the next year, what would you hope to have accomplished?

You’re not locked into any of this; one of the wonderful things about blogs is how they constantly evolve as we learn, grow, and interact with one another — but it’s good to know where and why you started, and articulating your goals may just give you a few other post ideas.

Can’t think how to get started? Just write the first thing that pops into your head. Anne Lamott, author of a book on writing we love, says that you need to give yourself permission to write a “crappy first draft”. Anne makes a great point — just start writing, and worry about editing it later.

When you’re ready to publish, give your post three to five tags that describe your blog’s focus — writing, photography, fiction, parenting, food, cars, movies, sports, whatever. These tags will help others who care about your topics find you in the Reader. Make sure one of the tags is “zerotohero,” so other new bloggers can find you, too.