如何将堆栈布局设置为屏幕高度的一半

本文关键字:屏幕 高度 一半 设置 堆栈布局 | 更新日期: 2023-09-27 17:58:05

我正在努力确保动态加载的图像在应用程序中占据一致的垂直空间。很明显,我想在不定义静态高度的情况下这样做,这样我的视图就可以缩放到更小/更大的设备。

我假设有一种方法可以告诉一个堆叠的布局,你希望它与另一个堆叠布局共享空间。

下面是我尝试的:

    StackLayout _container, _top, _bottom;
    // left out irrelevant code
    _imageView = new CachedImage
    {
        HorizontalOptions = LayoutOptions.FillAndExpand,
        VerticalOptions = LayoutOptions.Start,
        DownsampleToViewSize = true,
        CacheDuration = TimeSpan.FromDays(5),
        TransparencyEnabled = false 
    };
    _top = new StackLayout { 
        BackgroundColor = Color.Red,
        HorizontalOptions = LayoutOptions.FillAndExpand,
        VerticalOptions = LayoutOptions.Start, 
        Children = { 
            _imageView
        }
    };
   _bottom = new StackLayout {
       BackgroundColor = Color.White,
       HorizontalOptions = LayoutOptions.FillAndExpand,
       VerticalOptions = LayoutOptions.End, 
       Children = {
           _oneThing,
           _twoThing
       }
   };
   _container = new StackLayout { 
   Padding = new Thickness (10),
   Spacing = 10,
   BackgroundColor = Color.Aqua,
   HorizontalOptions = LayoutOptions.FillAndExpand,
   VerticalOptions = LayoutOptions.FillAndExpand,
        Children = { 
            _top,
            _bottom 
        }
    };
    this.Content = _container;

不幸的是,这没有奏效。。。

我的问题

如何确保我的堆栈视图(或仅我的图像)只占视图的50%?

如何将堆栈布局设置为屏幕高度的一半

正如您提到的,您也可以使用带有一些RowDefinitions:的Grid

Grid mainLayout = new Grid
{
    VerticalOptions = LayoutOptions.FillAndExpand,
    RowDefinitions =
    {
        new RowDefinition { Height = new GridLength(1, GridUnitType.Star) }
        new RowDefinition { Height = new GridLength(1, GridUnitType.Star) }
    }
};
var _imageView = new Image
{
    HorizontalOptions = LayoutOptions.FillAndExpand,
    VerticalOptions = LayoutOptions.FillAndExpand
};
Grid.SetRow(_imageView, 0); //_imageView will be added to the first row
mainLayout.Children.Add(_imageView);