How to set Entry control over an image?

Alex Johanson 81 Reputation points
2021-06-17T18:31:42.7+00:00

Hi,
I want to set an Entry over an image that plays an input box role. I tried this XAML code but I couldn't set its correct position over the first rectangle (image):
106713-1.png
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="300"/>
<RowDefinition Height="300"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Image Source="Rectangle2.png" Grid.Row="0" Margin="2,10,0,0"/>
<Image Source="Rectangle2.png" Grid.Row="1" Margin="2,-300,0,0" />
<Grid Grid.Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="350"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="60"/>
</Grid.RowDefinitions>
<Entry Grid.Row="0" Margin="25,0,0,0" Placeholder="User Name:" PlaceholderColor="DimGray" MaxLength="30" ClearButtonVisibility="WhileEditing" TextColor="Black" />
</Grid>

    </Grid>  
Xamarin
Xamarin
A Microsoft open-source app platform for building Android and iOS apps with .NET and C#.
5,292 questions
0 comments No comments
{count} votes

Accepted answer
  1. Leon Lu (Shanghai Wicresoft Co,.Ltd.) 68,261 Reputation points Microsoft Vendor
    2021-06-18T01:56:15.173+00:00

    Hello,​

    Welcome to our Microsoft Q&A platform!

    Please change your RowDefinition Height="300" to <RowDefinition Height="*"/> . because your set the height too big, then Entry can not over Image.

    Here is my edited code.

       <StackLayout>  
               <Grid Margin="0,100,0,0">  
                   <Grid.RowDefinitions >  
                       <RowDefinition Height="*"/>  
                       <RowDefinition Height="*"/>  
                       <RowDefinition Height="Auto"/>  
                       <RowDefinition Height="Auto"/>  
                       <RowDefinition Height="Auto"/>  
                   </Grid.RowDefinitions>  
                    
                   <!---->  
                   <Image Source="Rectangle2.png" Grid.Row="0" HorizontalOptions="FillAndExpand"  Margin="2,0,0,0"/>  
                    
                   <Image Source="Rectangle2.png" Grid.Row="1" Margin="2,0,0,0" />  
         
         
         
                   <Grid Grid.Row="0" Padding="25,0,0,0" >  
                       <Grid.ColumnDefinitions>  
                           <ColumnDefinition Width="350"/>  
                       </Grid.ColumnDefinitions>  
                       <Grid.RowDefinitions>  
                           <RowDefinition Height="60"/>  
                       </Grid.RowDefinitions>  
                       <Entry  Grid.Row="0" Placeholder="User Name:" PlaceholderColor="DimGray" MaxLength="30"  ClearButtonVisibility="WhileEditing" TextColor="Black" />  
                   </Grid>  
               </Grid>  
         
           </StackLayout>  
    

    Here is code running screenshot.

    106749-image.png

    Here is an article about Gird, you can refer to it.

    https://learn.microsoft.com/en-us/xamarin/get-started/tutorials/grid/?tabs=vswin

    Best Regards,

    Leon Lu


    If the response is helpful, please click "Accept Answer" and upvote it.

    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

    1 person found this answer helpful.

0 additional answers

Sort by: Most helpful