Borjeo Von Dingle
Borjeo Von Dingle

Reputation: 15

Xamarin.Forms Entry Field in Stacklayout is cutoff in iOS but not Android

I have a TableView containing a number of ViewCells. Each ViewCell is a StackLayout of a Label and Entry field. Everything looks fine rendering on Android. On iOS, any ViewCell that has an field has the Field Value cutoff (ie. shows only the first character then a few dots). Pickers work just fine BTW. I've tried different MinimumWidthRequest to a high value, the different HorizontalOptions, ForceLayout() in OnAppearing(), etc.. How can I have these fields expand to the necessary minimums, to show the full value?

Android example iOS Example

                <TableView>
                    <TableSection  x:Name="tblSingleCourse">
                        <ViewCell IsEnabled="True">
                            <StackLayout Orientation="Horizontal" HorizontalOptions="Center">
                                <Label Text="Course Name:" />
                                <Entry x:Name="txtCourseTitle" HorizontalOptions="Center"/>
                            </StackLayout>
                        </ViewCell>
                        <ViewCell IsEnabled="True">
                            <StackLayout Orientation="Horizontal" HorizontalOptions="Center">
                                <Label Text="Start Date:" />
                                <DatePicker x:Name="dpStartDate" Format="D"></DatePicker>
                            </StackLayout>
                        </ViewCell>
                    </TableSection>
                </TableView>

Upvotes: 0

Views: 324

Answers (1)

Anand
Anand

Reputation: 1959

Try this

   <Grid Margin="10" RowSpacing="10">

        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>

        <Grid Grid.Row="0" HorizontalOptions="FillAndExpand">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="3*"/>
                <ColumnDefinition Width="7*"/>
            </Grid.ColumnDefinitions>
            <Label Text="Course Name:" FontAttributes="Bold" Grid.Column="0" HorizontalOptions="StartAndExpand" VerticalOptions="Center"/>
            <Entry Grid.Column="1" PlaceholderColor="LightBlue" Placeholder="Enter Course name" x:Name="txtCourseTitle" HorizontalOptions="StartAndExpand" VerticalOptions="Center"/>
        </Grid>

        <Grid Grid.Row="1" HorizontalOptions="FillAndExpand">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="3*"/>
                <ColumnDefinition Width="7*"/>
            </Grid.ColumnDefinitions>
            <Label Text="Start Date:" FontAttributes="Bold" Grid.Column="0" HorizontalOptions="StartAndExpand" VerticalOptions="Center"/>
            <Entry Grid.Column="1" PlaceholderColor="LightBlue" Placeholder="Enter StartDate" x:Name="dpStartDate" HorizontalOptions="StartAndExpand" VerticalOptions="Center"/>
        </Grid>

        <Button CornerRadius="7" HorizontalOptions="FillAndExpand" Margin="20,0,20,0" Grid.Row="2" Text="Discard changes" FontSize="Small" TextColor="White" BackgroundColor="PaleVioletRed"></Button>
        <Button CornerRadius="7" HorizontalOptions="FillAndExpand" Margin="20,0,20,0" Grid.Row="3" Text="Save changes" FontSize="Small" TextColor="White" BackgroundColor="PaleVioletRed"></Button>

    </Grid>

Upvotes: 2

Related Questions