Set the value for Dynamically Created Dropdowns

tanmaygeektanmaygeek Member ✭✭

counter = counter + 1;

        Grid grid = new Grid
        {

            RowDefinitions =
            {
                new RowDefinition { Height = GridLength.Auto },
            },

        };

        StackLayout stk = new StackLayout { };

        Grid weightPieceGrid = new Grid
        {
            ColumnDefinitions =
            {
                new ColumnDefinition { Width= new GridLength(50,GridUnitType.Star) },
                new ColumnDefinition { Width= new GridLength(50,GridUnitType.Star) },
            },
        };

        Grid weightGrid = new Grid
        {
            ColumnDefinitions =
            {
                new ColumnDefinition { Width= new GridLength(90,GridUnitType.Star) },
                new ColumnDefinition { Width= new GridLength(10,GridUnitType.Star) },
            },
        };


        Grid pieceGrid = new Grid
        {
            ColumnDefinitions =
            {
                new ColumnDefinition { Width= new GridLength(90,GridUnitType.Star) },

            },
        };

        Grid dimGrid = new Grid
        {
            ColumnDefinitions =
            {
                new ColumnDefinition { Width= new GridLength(30,GridUnitType.Star) },
                new ColumnDefinition { Width= new GridLength(30,GridUnitType.Star) },
                 new ColumnDefinition { Width= new GridLength(30,GridUnitType.Star) },
                new ColumnDefinition { Width= new GridLength(10,GridUnitType.Star) },
            },
        };



        Grid classGrid = new Grid
        {
            ColumnDefinitions =
            {
                new ColumnDefinition { Width= new GridLength(90,GridUnitType.Star) },
                new ColumnDefinition { Width= new GridLength(10,GridUnitType.Star) },
            },

        };

        Label lblClassName = new Label
        {
            Text = "--Select Class--",
            HorizontalOptions = LayoutOptions.StartAndExpand,
            StyleId = "ClassLabel-" + counter,

        };


        TapGestureRecognizer tapGuesture = new TapGestureRecognizer();
        tapGuesture.Tapped += Class_Tapped;
        lblClassName.GestureRecognizers.Add(tapGuesture);





        Image imgddlClass = new Image
        {
            Source = "down_arrow.png",
            HorizontalOptions = LayoutOptions.End,
            StyleId = "ClassImage-" + counter,
        };
        TapGestureRecognizer tapImageGuesture = new TapGestureRecognizer();
        tapImageGuesture.Tapped += Class_Tapped;
        imgddlClass.GestureRecognizers.Add(tapImageGuesture);


        classGrid.Children.Add(lblClassName, 0, 0);
        classGrid.Children.Add(imgddlClass, 1, 0);


        Editor txtWeight = new Editor
        {
            Placeholder = "Weight",
            HorizontalOptions = LayoutOptions.FillAndExpand,
            Keyboard = Keyboard.Numeric,
            AutoSize = EditorAutoSizeOption.TextChanges,
            ClassId = counter.ToString(),

        };
        Label lblWeightUnit = new Label
        {
            Text = "LBs",
            TextColor = Color.FromHex("#006697"),
            HorizontalTextAlignment = TextAlignment.Center,
            VerticalTextAlignment = TextAlignment.Center
        };

        Editor txtPiece = new Editor
        {
            Placeholder = "Pieces",
            HorizontalOptions = LayoutOptions.FillAndExpand,
            Keyboard = Keyboard.Numeric,
            AutoSize = EditorAutoSizeOption.TextChanges
        };



        weightGrid.Children.Add(txtWeight, 0, 0);
        weightGrid.Children.Add(lblWeightUnit, 1, 0);

        pieceGrid.Children.Add(txtPiece, 0, 0);

        weightPieceGrid.Children.Add(weightGrid, 0, 0);
        weightPieceGrid.Children.Add(pieceGrid, 1, 0);



        Label lblProductLebel = new Label
        {
            Text = "Product",
            FontAttributes = FontAttributes.Bold,
            TextColor = Color.FromHex("#006697")
        };


        Label lblDimentionLabel = new Label
        {
            Text = "Dimentions",

        };

        Editor txtLengthBox = new Editor
        {
            Placeholder = "Length",
            HorizontalOptions = LayoutOptions.FillAndExpand,
            Keyboard = Keyboard.Numeric,
            AutoSize = EditorAutoSizeOption.TextChanges,
        };

        Editor txtWidthBox = new Editor
        {
            Placeholder = "Width",
            HorizontalOptions = LayoutOptions.FillAndExpand,
            Keyboard = Keyboard.Numeric,
            AutoSize = EditorAutoSizeOption.TextChanges,
        };

        Editor txtHeightBox = new Editor
        {
            Placeholder = "Height",
            HorizontalOptions = LayoutOptions.FillAndExpand,
            Keyboard = Keyboard.Numeric,
            AutoSize = EditorAutoSizeOption.TextChanges,
        };
        Label lblDimUnit = new Label
        {
            Text = "IN",
            TextColor = Color.FromHex("#006697"),
            HorizontalTextAlignment = TextAlignment.Center,
            VerticalTextAlignment = TextAlignment.Center
        };

        Label lblClassLabel = new Label
        {
            Text = "Class",
        };

        dimGrid.Children.Add(txtLengthBox, 0, 0);
        dimGrid.Children.Add(txtWidthBox, 1, 0);
        dimGrid.Children.Add(txtHeightBox, 2, 0);
        dimGrid.Children.Add(lblDimUnit, 3, 0);


        stk.Children.Add(lblProductLebel);
        stk.Children.Add(weightPieceGrid);
        stk.Children.Add(lblDimentionLabel);
        stk.Children.Add(dimGrid);
        stk.Children.Add(classGrid);
        grid.Children.Add(stk);

        stkProducts.Children.Add(grid);

`private void MoreProducts_Tapped(object sender, EventArgs e)
{
#region addMore
counter = counter + 1;

        Grid grid = new Grid
        {

            RowDefinitions =
            {
                new RowDefinition { Height = GridLength.Auto },
            },

        };

        StackLayout stk = new StackLayout { };

        Grid weightPieceGrid = new Grid
        {
            ColumnDefinitions =
            {
                new ColumnDefinition { Width= new GridLength(50,GridUnitType.Star) },
                new ColumnDefinition { Width= new GridLength(50,GridUnitType.Star) },
            },
        };

        Grid weightGrid = new Grid
        {
            ColumnDefinitions =
            {
                new ColumnDefinition { Width= new GridLength(90,GridUnitType.Star) },
                new ColumnDefinition { Width= new GridLength(10,GridUnitType.Star) },
            },
        };


        Grid pieceGrid = new Grid
        {
            ColumnDefinitions =
            {
                new ColumnDefinition { Width= new GridLength(90,GridUnitType.Star) },

            },
        };

        Grid dimGrid = new Grid
        {
            ColumnDefinitions =
            {
                new ColumnDefinition { Width= new GridLength(30,GridUnitType.Star) },
                new ColumnDefinition { Width= new GridLength(30,GridUnitType.Star) },
                 new ColumnDefinition { Width= new GridLength(30,GridUnitType.Star) },
                new ColumnDefinition { Width= new GridLength(10,GridUnitType.Star) },
            },
        };



        Grid classGrid = new Grid
        {
            ColumnDefinitions =
            {
                new ColumnDefinition { Width= new GridLength(90,GridUnitType.Star) },
                new ColumnDefinition { Width= new GridLength(10,GridUnitType.Star) },
            },

        };

        Label lblClassName = new Label
        {
            Text = "--Select Class--",
            HorizontalOptions = LayoutOptions.StartAndExpand,
            StyleId = "ClassLabel-" + counter,

        };


        TapGestureRecognizer tapGuesture = new TapGestureRecognizer();
        tapGuesture.Tapped += Class_Tapped;
        lblClassName.GestureRecognizers.Add(tapGuesture);





        Image imgddlClass = new Image
        {
            Source = "down_arrow.png",
            HorizontalOptions = LayoutOptions.End,
            StyleId = "ClassImage-" + counter,
        };
        TapGestureRecognizer tapImageGuesture = new TapGestureRecognizer();
        tapImageGuesture.Tapped += Class_Tapped;
        imgddlClass.GestureRecognizers.Add(tapImageGuesture);


        classGrid.Children.Add(lblClassName, 0, 0);
        classGrid.Children.Add(imgddlClass, 1, 0);


        Editor txtWeight = new Editor
        {
            Placeholder = "Weight",
            HorizontalOptions = LayoutOptions.FillAndExpand,
            Keyboard = Keyboard.Numeric,
            AutoSize = EditorAutoSizeOption.TextChanges,
            ClassId = counter.ToString(),

        };
        Label lblWeightUnit = new Label
        {
            Text = "LBs",
            TextColor = Color.FromHex("#006697"),
            HorizontalTextAlignment = TextAlignment.Center,
            VerticalTextAlignment = TextAlignment.Center
        };

        Editor txtPiece = new Editor
        {
            Placeholder = "Pieces",
            HorizontalOptions = LayoutOptions.FillAndExpand,
            Keyboard = Keyboard.Numeric,
            AutoSize = EditorAutoSizeOption.TextChanges
        };



        weightGrid.Children.Add(txtWeight, 0, 0);
        weightGrid.Children.Add(lblWeightUnit, 1, 0);

        pieceGrid.Children.Add(txtPiece, 0, 0);

        weightPieceGrid.Children.Add(weightGrid, 0, 0);
        weightPieceGrid.Children.Add(pieceGrid, 1, 0);



        Label lblProductLebel = new Label
        {
            Text = "Product",
            FontAttributes = FontAttributes.Bold,
            TextColor = Color.FromHex("#006697")
        };


        Label lblDimentionLabel = new Label
        {
            Text = "Dimentions",

        };

        Editor txtLengthBox = new Editor
        {
            Placeholder = "Length",
            HorizontalOptions = LayoutOptions.FillAndExpand,
            Keyboard = Keyboard.Numeric,
            AutoSize = EditorAutoSizeOption.TextChanges,
        };

        Editor txtWidthBox = new Editor
        {
            Placeholder = "Width",
            HorizontalOptions = LayoutOptions.FillAndExpand,
            Keyboard = Keyboard.Numeric,
            AutoSize = EditorAutoSizeOption.TextChanges,
        };

        Editor txtHeightBox = new Editor
        {
            Placeholder = "Height",
            HorizontalOptions = LayoutOptions.FillAndExpand,
            Keyboard = Keyboard.Numeric,
            AutoSize = EditorAutoSizeOption.TextChanges,
        };
        Label lblDimUnit = new Label
        {
            Text = "IN",
            TextColor = Color.FromHex("#006697"),
            HorizontalTextAlignment = TextAlignment.Center,
            VerticalTextAlignment = TextAlignment.Center
        };

        Label lblClassLabel = new Label
        {
            Text = "Class",
        };

        dimGrid.Children.Add(txtLengthBox, 0, 0);
        dimGrid.Children.Add(txtWidthBox, 1, 0);
        dimGrid.Children.Add(txtHeightBox, 2, 0);
        dimGrid.Children.Add(lblDimUnit, 3, 0);


        stk.Children.Add(lblProductLebel);
        stk.Children.Add(weightPieceGrid);
        stk.Children.Add(lblDimentionLabel);
        stk.Children.Add(dimGrid);
        stk.Children.Add(classGrid);
        grid.Children.Add(stk);

        stkProducts.Children.Add(grid);
        #endregion
        //await Navigation.PushModalAsync(new Products());
    }`
Tagged:

Answers

  • tanmaygeektanmaygeek Member ✭✭

    With the above code,

    I am creating a set of controls on a tap over some button. It contains some editors and a drop down (combination of a label and image) each. When I click on the drop down label, it opens a popup, populates the drop down items. On tapping on any item, it will set that drop down label value to that selected value. I can do that with single drop down through the x:Name. But for the dynamically created blocks, I can not set the selected value at popup back to the drop down label. Please help.

  • tanmaygeektanmaygeek Member ✭✭

    The XAML code is:

    ` <ContentPage.Content>

        <ScrollView>
            <Grid Margin="5">
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <!--<RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>-->
                </Grid.RowDefinitions>
                <Label Text="+ Add More Stops" FontAttributes="Bold" TextColor="Blue" HorizontalTextAlignment="Center"/>
                <StackLayout Grid.Row="1" HeightRequest="1" VerticalOptions="StartAndExpand" BackgroundColor="LightGray" Margin="0,10"/>
                <StackLayout x:Name="stkProducts" Grid.Row="2" Spacing="0">
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                        </Grid.RowDefinitions>
                        <StackLayout Grid.Row="0">
    
                            <Label Text="Product" FontAttributes="Bold" TextColor="#006697"/>
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="50*"/>
                                    <ColumnDefinition Width="50*"/>
                                </Grid.ColumnDefinitions>
                                <Grid Grid.Column="0">
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="90*"/>
                                        <ColumnDefinition Width="10*"/>
                                    </Grid.ColumnDefinitions>
                                    <Editor x:Name="txtWeight" Placeholder="Weight" HorizontalOptions="FillAndExpand" Keyboard="Numeric" AutoSize="TextChanges" />
                                    <Label Grid.Column="1" Text="LBs" TextColor="#006697" HorizontalTextAlignment="Center" VerticalTextAlignment="Center"/>
                                </Grid>
                                <Grid Grid.Column="1">
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="90*"/>
                                        <ColumnDefinition Width="10*"/>
                                    </Grid.ColumnDefinitions>
                                    <Editor x:Name="txtPieces" Placeholder="Pieces" HorizontalOptions="FillAndExpand" Keyboard="Numeric" AutoSize="TextChanges" />
                                    <Label Grid.Column="1" Text=""/>
                                </Grid>
    
                            </Grid>
                            <Label Text="Dimentions"/>
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="30*"/>
                                    <ColumnDefinition Width="30*"/>
                                    <ColumnDefinition Width="30*"/>
                                    <ColumnDefinition Width="10*"/>
                                </Grid.ColumnDefinitions>
                                <Editor x:Name="txtLength" Placeholder="Length" HorizontalOptions="FillAndExpand" Keyboard="Numeric" AutoSize="TextChanges" />
                                <Editor Grid.Column="1" x:Name="txtWidth" Placeholder="Width" HorizontalOptions="FillAndExpand" Keyboard="Numeric" AutoSize="TextChanges" />
                                <Editor Grid.Column="2" x:Name="txtHeight" Placeholder="Height" HorizontalOptions="FillAndExpand" Keyboard="Numeric" AutoSize="TextChanges" />
                                <Label  Grid.Column="3" Text="IN" TextColor="#006697" HorizontalTextAlignment="Center" VerticalTextAlignment="Center"/>
                            </Grid>
                            <Label Text="Class"/>                           
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="90*"/>
                                    <ColumnDefinition Width="10*"/>
                                </Grid.ColumnDefinitions>
                                <Label x:Name="lblClass" StyleId="ClassLabel-0">
                                    <Label.GestureRecognizers>
                                        <TapGestureRecognizer Tapped="Class_Tapped" />
                                    </Label.GestureRecognizers>
                                </Label>
                                <Image x:Name="ddlClass"  StyleId="ClassImage-0" Source="down_arrow.png" Grid.Column="1" HorizontalOptions="EndAndExpand">
                                    <Image.GestureRecognizers>
                                        <TapGestureRecognizer Tapped="Class_Tapped"/>
                                    </Image.GestureRecognizers>
                                </Image>
                            </Grid>
                        </StackLayout>
                    </Grid>
                </StackLayout>
                <Grid Grid.Row="3">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="auto"/>
                            <RowDefinition Height="auto"/>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
    
                        </Grid.ColumnDefinitions>
                        <Label x:Name="addMoreProduct" Text="+ Add New Product" FontAttributes="Bold" TextColor="Blue" HorizontalTextAlignment="Center">
    
                            <Label.GestureRecognizers>
                                <TapGestureRecognizer Tapped="MoreProducts_Tapped" />
                            </Label.GestureRecognizers>
                        </Label>
    
                        <StackLayout Grid.Row="1" HeightRequest="1" VerticalOptions="StartAndExpand" BackgroundColor="LightGray" Margin="0,10"/>
    
                    </Grid>
                </Grid>
                <Grid Grid.Row="4">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="auto"/>
                            <RowDefinition Height="auto"/>
                            <RowDefinition Height="auto"/>
                            <RowDefinition Height="auto"/>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
    
                        </Grid.ColumnDefinitions>
                        <Label Text="Shipment Date"/>
                        <DatePicker Grid.Row="1" x:Name="shipmentDate" HorizontalOptions="FillAndExpand" Format="MM-dd-yyyy"/>
                        <Label Grid.Row="2" Text="Delivery Date"/>
                        <DatePicker Grid.Row="3" x:Name="deliveryDate" HorizontalOptions="FillAndExpand" Format="MM-dd-yyyy"/>
    
                    </Grid>
                </Grid>
                <Grid Grid.Row="5">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <Button Text="Next" x:Name="btnnext" CornerRadius="30" BackgroundColor="#006697" TextColor="White" Clicked="Btnnext_Clicked"/>
                </Grid>
                <StackLayout Grid.Row="6" HeightRequest="1" VerticalOptions="StartAndExpand" BackgroundColor="LightGray" Margin="0,10"/>
    
            </Grid>
        </ScrollView>
    </ContentPage.Content>`
    
  • tanmaygeektanmaygeek Member ✭✭

    @AdamMeaney can you please help?

  • AdamMeaneyAdamMeaney USMember ✭✭✭✭✭

    Format code on forums

    I would say your biggest need is some bindings. Following MVVM patterns.

    The linked blog has some good thoughts on MVVM if you need some examples.

    My impression is that you should be doing this a little more like:

    VM:

    You have a list of Stops. That list contains model objects with the other properties, like Dimensions, Product Names, etc.

    View:

    Make one composite view class that contains a Stop. Every property should be bound to a property of your stop.

    Bindings match your StopView with your StopModel object.

    Advice:

    Every x:Name you have is probably bad. Those are only needed in rare cases, or for when you hate yourself and refuse to use Bindings.

    If you want advice on specifics, we can dig into it more, but it looks like your first step should be to reevaluate this using MVVM practices.

Sign In or Register to comment.