2

我有以下 xamarin 布局架构：

<StackLayout>
    <Grid>...</Grid> <!-- TOP GRID - This must be fixed -->
    <ScrollView>...</ScrollView> <!-- This must scroll  -->
    <Grid><Entry></Entry>/Grid>  <!-- BOTTOM GRID - This must scroll -->
</StackLayout>

iOS 行为如我所愿（这是一个聊天布局，所以顶部栏有我希望一直可见的图片和用户名），但 android 行为是向上滚动整个页面并且只保持 ScrollView 的条目和底部可见，即几乎是我需要的，但 Top Grid 正在消失。只有 Srollview 和底部网格必须滚动。

我怎样才能做到这一点？

编辑 1

示例项目：

https://wetransfer.com/downloads/46b455cb7148189a0d1f84affa77b7e120210428144025/02b001

4

1 回答 1

0

你可以这样试试。

基本的布局结构将是这样的。

  <Grid RowDefinitions="50,*,Auto">
            <StackLayout Grid.Row="0" >
                <!-- Username and Profile image -->
            </StackLayout>
            <CollectionView Grid.Row="1">
                <!-- Your COllectionView -->
            </CollectionView>
            <controls:KeyboardView Grid.Row="2">
                <controls:KeyboardView.Margin>
                    <OnPlatform x:TypeArguments="Thickness">
                        <On Platform="iOS" Value="0,0,0,10" />
                        <On Platform="Android" Value="0,0,0,5" />
                    </OnPlatform>
                </controls:KeyboardView.Margin>
                <!-- Your entry and Send Button -->
            </controls:KeyboardView>

        </Grid>

在您的 PCL 上，创建KeyboardView

 public class KeyboardView : Grid { }

在 ios 创建KeyboardViewRenderer

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using CoreGraphics;
using Foundation;
using UIKit;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;

[assembly: ExportRenderer(typeof(KeyboardView), typeof(KeyboardViewRenderer))]
namespace YourAppName.iOS.CustomRender
{
    public class KeyboardViewRenderer : ViewRenderer
    {
        NSObject _keyboardShowObserver;
        NSObject _keyboardHideObserver;
        protected override void OnElementChanged(ElementChangedEventArgs<View> e)
        {
            base.OnElementChanged(e);

            if (e.NewElement != null)
            {
                RegisterForKeyboardNotifications();
            }

            if (e.OldElement != null)
            {
                UnregisterForKeyboardNotifications();
            }
        }

        void RegisterForKeyboardNotifications()
        {
            if (_keyboardShowObserver == null)
                _keyboardShowObserver = UIKeyboard.Notifications.ObserveWillShow(OnKeyboardShow);
            if (_keyboardHideObserver == null)
                _keyboardHideObserver = UIKeyboard.Notifications.ObserveWillHide(OnKeyboardHide);
        }

        void OnKeyboardShow(object sender, UIKeyboardEventArgs args)
        {

            NSValue result = (NSValue)args.Notification.UserInfo.ObjectForKey(new NSString(UIKeyboard.FrameEndUserInfoKey));
            CGSize keyboardSize = result.RectangleFValue.Size;
            if (Element != null)
            {
                Element.Margin = new Thickness(0, 0, 0, keyboardSize.Height); //push the entry up to keyboard height when keyboard is activated

            }
        }

        void OnKeyboardHide(object sender, UIKeyboardEventArgs args)
        {
            if (Element != null)
            {
                Element.Margin = new Thickness(0); //set the margins to zero when keyboard is dismissed
            }

        }


        void UnregisterForKeyboardNotifications()
        {
            if (_keyboardShowObserver != null)
            {
                _keyboardShowObserver.Dispose();
                _keyboardShowObserver = null;
            }

            if (_keyboardHideObserver != null)
            {
                _keyboardHideObserver.Dispose();
                _keyboardHideObserver = null;
            }
        }
    }
}

对于 Android，在 App.Xaml 中添加这个

<?xml version="1.0" encoding="utf-8"?>
<Application xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
             x:Class="KeyboardSample.App"
             xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
             android:Application.WindowSoftInputModeAdjust="Resize">
    <Application.Resources>
    </Application.Resources>
</Application>

更新 1

从您的解决方案中，您需要进行 3 处更改。

  1. 以您的风格从 MainTheme.Base 中删除此行。

    <item name="android:windowFullscreen">true</item>

  2. 从 MainActivity 中删除此行 Window.SetSoftInputMode(Android.Views.SoftInput.AdjustResize);

  3. 在 mainactivity 中添加 Xamarin.Forms.Application.Current.On<Xamarin.Forms.PlatformConfiguration.Android>().UseWindowSoftInputModeAdjust(WindowSoftInputModeAdjust.Resize); LoadApplication 之后。

更新 2

如果去除android:windowFullscreen混乱的状态栏颜色以及底栏颜色，我们可以使用自定义渲染。

创建接口IStatusBarPlatformSpecific

public interface IStatusBarPlatformSpecific
    {
        void SetStatusBarColor(Color color);
        void SetBottomBarColor(Color color);
    }

在 android 项目中创建渲染命名Statusbar

[assembly: Dependency(typeof(Statusbar))]
namespace YourAppName.Droid.CustomRender.StatusBar_Color
{
    public class Statusbar : IStatusBarPlatformSpecific
    {
        public Statusbar()
        {
        }
        public void SetStatusBarColor(System.Drawing.Color color)
        {
            CrossCurrentActivity.Current.Activity.Window.SetStatusBarColor(ToAndroidColor(color));
        }   
        public void SetBottomBarColor(System.Drawing.Color color)
        {          
            CrossCurrentActivity.Current.Activity.Window.SetNavigationBarColor(ToAndroidColor(color));
        }

        public static Android.Graphics.Color ToAndroidColor(System.Drawing.Color color)
        {
            return new Android.Graphics.Color(color.ToArgb());
        }
    }
}

现在您可以OnAppearing像这样从所需的页面调用它。

protected override async void OnAppearing()
        {
            base.OnAppearing();
            if (Device.RuntimePlatform == Device.Android)
            {
                var statusbar = 
                 DependencyService.Get<IStatusBarPlatformSpecific>();
                statusbar.SetStatusBarColor(Color.FromHex("#112330"));
                statusbar.SetBottomBarColor(Color.FromHex("#304E62"));
            }

    }

您现在可以为您的页面设置状态栏颜色和底部颜色匹配。让我知道这是否适合您。

于 2021-04-27T17:22:20.193 回答