MAUI Blazor如何隐藏滚动条

MAUI Blazor如何隐藏滚动条

Windows

在Windows上是最简单的，改css就可以了，把下面这段添加到app.css中

::-webkit-scrollbar {
    display: none; 
}

安卓

安卓和iOS有点复杂，需要通过webview

1. 修改csproj文件，添加以下内容

<ItemGroup Condition="$(TargetFramework.StartsWith('net7.0-android')) != true">
		<Compile Remove="**\**\*.Android.cs" />
		<None Include="**\**\*.Android.cs" Exclude="$(DefaultItemExcludes);$(DefaultExcludesInProjectFolder)" />
	</ItemGroup>

	<ItemGroup Condition="$(TargetFramework.StartsWith('net7.0-ios')) != true AND $(TargetFramework.StartsWith('net7.0-maccatalyst')) != true">
		<Compile Remove="**\**\*.iOS.cs" />
		<None Include="**\**\*.iOS.cs" Exclude="$(DefaultItemExcludes);$(DefaultExcludesInProjectFolder)" />
	</ItemGroup>

	<ItemGroup Condition="$(TargetFramework.Contains('-windows')) != true ">
		<Compile Remove="**\*.Windows.cs" />
		<None Include="**\*.Windows.cs" Exclude="$(DefaultItemExcludes);$(DefaultExcludesInProjectFolder)" />
	</ItemGroup>

2. 修改MainPage.xaml
   
3. 修改MainPage.xaml.cs

public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();

            _blazorWebView.BlazorWebViewInitializing += BlazorWebViewInitializing;
            _blazorWebView.BlazorWebViewInitialized += BlazorWebViewInitialized;
        }

        private partial void BlazorWebViewInitializing(object? sender, BlazorWebViewInitializingEventArgs e);
        private partial void BlazorWebViewInitialized(object? sender, BlazorWebViewInitializedEventArgs e);
    }

4. 添加MainPage.xaml.Android.cs文件

public partial class MainPage
    {
        private partial void BlazorWebViewInitializing(object? sender, BlazorWebViewInitializingEventArgs e)
        {
        }

        private partial void BlazorWebViewInitialized(object? sender, BlazorWebViewInitializedEventArgs e)
        {
            e.WebView.VerticalScrollBarEnabled = false;
        }
    }

iOS

与安卓一致
添加MainPage.xaml.iOS.cs文件

public partial class MainPage
    {
        private partial void BlazorWebViewInitializing(object? sender, BlazorWebViewInitializingEventArgs e)
        {
            e.Configuration.AllowsInlineMediaPlayback = true;
            e.Configuration.MediaTypesRequiringUserActionForPlayback = WebKit.WKAudiovisualMediaTypes.None;
        }

        private partial void BlazorWebViewInitialized(object? sender, BlazorWebViewInitializedEventArgs e)
        {
            e.WebView.ScrollView.ShowsVerticalScrollIndicator = false;
        }
    }

下面这段最好也加上
添加MainPage.xaml.Windows.cs文件

public partial class MainPage
    {
        private partial void BlazorWebViewInitializing(object? sender, BlazorWebViewInitializingEventArgs e)
        {
        }

        private partial void BlazorWebViewInitialized(object? sender, BlazorWebViewInitializedEventArgs e)
        {
        }
    }