Problem understanding how this content is been displayed

  • (2 Pages)
  • +
  • 1
  • 2

15 Replies - 1009 Views - Last Post: 07 May 2017 - 11:01 PM

#1 Dialupp  Icon User is offline

  • D.I.C Head

Reputation: -2
  • View blog
  • Posts: 210
  • Joined: 31-October 16

Problem understanding how this content is been displayed

Posted 06 May 2017 - 09:38 AM

Hey guys so I been working on this quite a few hours and I just can't figure it so basically it will generate 10 buttons in the for loop but I don't get how. Like I see it makes 10 buttons and the code " this.Content = mainStack;" makes the buttons appear, but how does that make any sense? In the for loop the "mainstack" only 4 times are items added to it on this line here "mainStack.Children.Add(rowStack);" it ends up going in that if statement around 4 times. I believe that's not for the buttons its for how its displayed. on so next line down it makes the buttons that makes sense but now this line doesn't make sense " rowStack.Children.Add(digitButton);"

it won't generate the buttons without this code, how does this make sense? We are setting the content to mainstack not to rowStack:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;

namespace YoutubeApp
{
    class SimplestKeypadPage : ContentPage
    {
        Label displayLabel;
        Button backspaceButton;
        public SimplestKeypadPage()
        {
            // Create a vertical stack for the entire keypad.
            StackLayout mainStack = new StackLayout
            {
                VerticalOptions = LayoutOptions.Center,
                HorizontalOptions = LayoutOptions.Center
            };
            // First row is the Label.
            displayLabel = new Label
            {
                FontSize = Device.GetNamedSize(NamedSize.Large, typeof(Label)),
                VerticalOptions = LayoutOptions.Center,
                HorizontalTextAlignment = TextAlignment.End
            };
            mainStack.Children.Add(displayLabel);
            // Second row is the backspace Button.
            backspaceButton = new Button
            {
                Text = "\u21E6",
                FontSize = Device.GetNamedSize(NamedSize.Large, typeof(Button)),
                IsEnabled = false
            };
            backspaceButton.Clicked += OnBackspaceButtonclicked;
            //  mainStack.Children.Add(backspaceButton);
            // Now do the 10 number keys.
            StackLayout rowStack = null;

            for (int num = 1; num <= 10; num++)
            {
                if ((num - 1) % 3 == 0)
                {
                    rowStack = new StackLayout
                    {
                        Orientation = StackOrientation.Horizontal
                    };
                    mainStack.Children.Add(rowStack);

                }

                Button digitButton = new Button
                {
                    Text = (num % 10).ToString(),
                    FontSize = Device.GetNamedSize(NamedSize.Large, typeof(Button)),
                    StyleId = (num % 10).ToString()

                };
                //   digitButton.Clicked += OnDigitButtonclicked;
                //if (num == 10)
                //{
                //    digitButton.HorizontalOptions = LayoutOptions.FillAndExpand;
                //}
                rowStack.Children.Add(digitButton);

                this.Content = mainStack;

            }




        }


        void OnDigitButtonclicked(object sender, EventArgs args)
        {
            Button button = (Button)sender;
            displayLabel.Text += (string)button.StyleId;
            backspaceButton.IsEnabled = true;
        }
        void OnBackspaceButtonclicked(object sender, EventArgs args)
        {
            string text = displayLabel.Text;
            displayLabel.Text = text.Substring(0, text.Length - 1);
            backspaceButton.IsEnabled = displayLabel.Text.Length > 0;
        }


    }
}






Is This A Good Question/Topic? 0
  • +

Replies To: Problem understanding how this content is been displayed

#2 modi123_1  Icon User is online

  • Suitor #2
  • member icon



Reputation: 13489
  • View blog
  • Posts: 53,884
  • Joined: 12-June 08

Re: Problem understanding how this content is been displayed

Posted 06 May 2017 - 12:44 PM

Seems straight forward.

For loop on line 42.. goes from 1 to 10.

In each iteration of the loop:
Line 54 creates a new button object.
Line 66 adds the newly minted button objected to some collection.
Was This Post Helpful? 0
  • +
  • -

#3 Dialupp  Icon User is offline

  • D.I.C Head

Reputation: -2
  • View blog
  • Posts: 210
  • Joined: 31-October 16

Re: Problem understanding how this content is been displayed

Posted 06 May 2017 - 08:45 PM

Yeah I get it adds to the collection but how does it display? We didn't set the content as that collection.
Was This Post Helpful? 0
  • +
  • -

#4 Dialupp  Icon User is offline

  • D.I.C Head

Reputation: -2
  • View blog
  • Posts: 210
  • Joined: 31-October 16

Re: Problem understanding how this content is been displayed

Posted 07 May 2017 - 12:28 AM

I been debugging alot and its caused by the "mainStack.Children.Add(rowStack);" this adds the buttons fair enough but doesnt make sense to me how it generates 10 buttons instead of 9, from what I saw it added 9 buttons in total inside the mainstack
Was This Post Helpful? 0
  • +
  • -

#5 Dialupp  Icon User is offline

  • D.I.C Head

Reputation: -2
  • View blog
  • Posts: 210
  • Joined: 31-October 16

Re: Problem understanding how this content is been displayed

Posted 07 May 2017 - 03:31 PM

bump
Was This Post Helpful? 0
  • +
  • -

#6 modi123_1  Icon User is online

  • Suitor #2
  • member icon



Reputation: 13489
  • View blog
  • Posts: 53,884
  • Joined: 12-June 08

Re: Problem understanding how this content is been displayed

Posted 07 May 2017 - 08:54 PM

What is the bump for?

The for loop is 1 to less than or equal to 10. Seems fairly straight forward, counting it out, how many buttons are added.
Was This Post Helpful? 0
  • +
  • -

#7 Dialupp  Icon User is offline

  • D.I.C Head

Reputation: -2
  • View blog
  • Posts: 210
  • Joined: 31-October 16

Re: Problem understanding how this content is been displayed

Posted 07 May 2017 - 09:08 PM

Yeah sorry shouldn't have bumped just this has been stuck on my mind for a couple days just want to get it over and solved with. Yes I get that, but it doesn't make sense "this.content = mainstack" this line here is what will be displayed on the screen so it will display on the screen the "contents" of mainstack, but mainstack doesn't have buttons why are their buttons displayed on the screen?

EDIT: Forgot to say yeah I saw why its 10 buttons I made mistake on the variable, but still don't get how buttons are on the screen if we set content to mainstack but mainstack contains no buttons.

This post has been edited by Dialupp: 07 May 2017 - 09:09 PM

Was This Post Helpful? 0
  • +
  • -

#8 modi123_1  Icon User is online

  • Suitor #2
  • member icon



Reputation: 13489
  • View blog
  • Posts: 53,884
  • Joined: 12-June 08

Re: Problem understanding how this content is been displayed

Posted 07 May 2017 - 09:30 PM

Perhaps be more clear and coherent on what you are asking. :^:

Perhaps read up on what 'content' is.
Example:
https://developer.xa...ntPage.Content/

The code adds buttons to a collection, the collection is added to the default 'content' for hte page. Voila. Again.. pretty straight forward given what you wrote.

Side note - cross posted here.
Was This Post Helpful? 0
  • +
  • -

#9 Dialupp  Icon User is offline

  • D.I.C Head

Reputation: -2
  • View blog
  • Posts: 210
  • Joined: 31-October 16

Re: Problem understanding how this content is been displayed

Posted 07 May 2017 - 09:50 PM

Ok so I read the link and it says "Gets or sets the view that contains the content of the Page." ok so contents of the page, mainstack contains the contents of the page (not the buttons) its mainstack which we are assigning to the contents of the page, so I am still confused on why the buttons are being displayed. Also yes that's my post the other one, I just want to get this problem over and done with.
Was This Post Helpful? 0
  • +
  • -

#10 modi123_1  Icon User is online

  • Suitor #2
  • member icon



Reputation: 13489
  • View blog
  • Posts: 53,884
  • Joined: 12-June 08

Re: Problem understanding how this content is been displayed

Posted 07 May 2017 - 09:55 PM

For Peter's sake. The 'this.content' is your page container. What ever is added to that should be visually appearing on your form. Your buttons are added to a container 'mainstack'. All of those buttons in the container are added to the 'this.content'.. aka the page.
Was This Post Helpful? 0
  • +
  • -

#11 Dialupp  Icon User is offline

  • D.I.C Head

Reputation: -2
  • View blog
  • Posts: 210
  • Joined: 31-October 16

Re: Problem understanding how this content is been displayed

Posted 07 May 2017 - 10:04 PM

Sorry to frustrate its just can't grasp it yet. You said "Your buttons are added to a container 'mainstack'" I said that mainstack doesn't contain buttons.
Was This Post Helpful? 0
  • +
  • -

#12 modi123_1  Icon User is online

  • Suitor #2
  • member icon



Reputation: 13489
  • View blog
  • Posts: 53,884
  • Joined: 12-June 08

Re: Problem understanding how this content is been displayed

Posted 07 May 2017 - 10:07 PM

Quote

I said that mainstack doesn't contain buttons.

That is functionally not true.

Button is created.
54	                Button digitButton = new Button


Button added to this container.
66	                rowStack.Children.Add(digitButton);


That container (and all the buttons added to it) is added to this container.
50	                    mainStack.Children.Add(rowStack);


The container of containers which contains buttons is added to the page's container for display.
68	                this.Content = mainStack;



Go to your kitchen drawer and pull out all the spoons. Put those spoons in various tupperware containers.. put those tupperware containers in a bucket.. put that bucket in a curio cabinet.. does that curio cabinet contain the spoons? Yes.. yes it does.
Was This Post Helpful? 0
  • +
  • -

#13 Dialupp  Icon User is offline

  • D.I.C Head

Reputation: -2
  • View blog
  • Posts: 210
  • Joined: 31-October 16

Re: Problem understanding how this content is been displayed

Posted 07 May 2017 - 10:15 PM

Err I don't think this part is correct

"That container (and all the buttons added to it) is added to this container." every time it does get inside the if statement we create a new object and if u put rowStack.Children.Count(); into the watch window you will it resets once it goes inside the if statement making it 0. Unless you're trying to say the previous instance of this "rowStack = new StackLayout" its added to.

This post has been edited by Dialupp: 07 May 2017 - 10:17 PM

Was This Post Helpful? 0
  • +
  • -

#14 modi123_1  Icon User is online

  • Suitor #2
  • member icon



Reputation: 13489
  • View blog
  • Posts: 53,884
  • Joined: 12-June 08

Re: Problem understanding how this content is been displayed

Posted 07 May 2017 - 10:18 PM

I don't know what you are pointing at.

How is it not correct? Step through it. You see the visual representation of the objects being transferred to containers.. So the variable name is being reused in a loop.. the each loop through the object is added to a container and sticks there.
Was This Post Helpful? 0
  • +
  • -

#15 Dialupp  Icon User is offline

  • D.I.C Head

Reputation: -2
  • View blog
  • Posts: 210
  • Joined: 31-October 16

Re: Problem understanding how this content is been displayed

Posted 07 May 2017 - 10:21 PM

Ok I'll try re read what you wrote a few times.
Was This Post Helpful? 0
  • +
  • -

  • (2 Pages)
  • +
  • 1
  • 2