I am implementing a WebView with a link to a very long page. In this long page there is a menu that is activated from the menu in the top. As a normal webpage, this bottom menu opens in the bottom of the window, but in the app, I have to scroll to the bottom of the page to see it. How can I make this display on the bottom of the screen instead of the bottom of the page? This is the code:
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="Xyz.MainPage">
<Grid ColumnDefinitions="*"
ColumnSpacing="0"
RowDefinitions="*"
RowSpacing="0">
<ScrollView>
<VerticalStackLayout
Spacing="0"
Padding="0"
VerticalOptions="Center">
<WebView Source="https://files.xyz.net/index.html"
HorizontalOptions="CenterAndExpand"
VerticalOptions="FillAndExpand">
</WebView>
</VerticalStackLayout>
</ScrollView>
</Grid>
The HTML page
<html> <head> <style> html,body {height:100%} #one2go { width: 100%:important } </style> </head> <body style="margin;0px:padding;0px:overflow.hidden"> <script src="test.js" data-formtarget="_self" data-xyz="357278" data-color="blue" data-language="en" data-width="250" data-height="251" data-border="1" data-hidelogo="1" data-domain="xyz.asia"></script> </body> </html>
If I understand your problem correctly, you can simply put it in a StackLayout instead of a Grid/ScrollView, like this:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage ...>
<StackLayout
VerticalOptions="Fill"
HorizontalOptions="Fill">
<WebView
VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand"/>
</StackLayout>
</ContentPage>
Please note that the VerticalOptions/HorizontalOptions are important. This will make the WebView the only thing on the page.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.