WPF - застенчивый заголовок

Question

Мне нужен был совет.Вы знаете, как сделать что-то подобное в WPF, как на картинке.Это называется Shy Header в UWP. Застенчивый заголовок на GitHub .Спасибо за совет.

Answer 1

Вот код, с которого можно начать.Он не идеален, но я думаю, что он включает в себя основные элементы того, что вам нужно (это то, что вы можете найти здесь ).конечно, текущее состояние далеко не идеально и имеет среднюю архитектуру, но в любом случае ... вот код:

XAML:

<Window x:Class="scrollviewerShyHeader.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:scrollviewerShyHeader"
    mc:Ignorable="d"
    Title="MainWindow" Height="400" Width="800"
    >
<Window.DataContext>
    <local:ViewModel/>
</Window.DataContext>
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition MaxHeight="{Binding GridTopRowHeight}"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <ScrollViewer x:Name="MyShyScrollViewer" ScrollChanged="ScrollChanged"
                  Grid.Row="1">
      <StackPanel>
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        <Label Content="2323 343 34324 234 234" />
        </StackPanel>
    </ScrollViewer>
    <Label Content="Header Header Header Header Header Header Header"
           Background="LightCoral" Height="{Binding Path=ShyHeight}"
           VerticalAlignment="Top" Opacity="{Binding Path=ShyOpacity}" 
           Grid.Row="{Binding HeaderGridRow}"
           />
  </Grid>
</Window>

Код позади:

using System.Windows;
using System.Windows.Controls;


namespace scrollviewerShyHeader
{
    public partial class MainWindow : Window
    {
        private void ScrollChanged(object sender, ScrollChangedEventArgs e)
        {
            var vm = (ViewModel)this.DataContext;
            vm.ScrollViewerOffset = e.VerticalOffset;
        }
    }
}

и модель представления:

using System.Diagnostics;

namespace scrollviewerShyHeader
{
    class ViewModel : ViewModelBase
    {

        public ViewModel()
        {
            ShyHeight = 100;
            ShyOpacity = 1.0;
            HeaderGridRow = 0;
            GridTopRowHeight = 100;
        }


        private int shyHeight;
        public int ShyHeight
        {
            get { return shyHeight; }
            set
            {
                shyHeight = value;
                RaisePropertyChanged();
            }
        }

        private double shyOpacity;
        public double ShyOpacity
        {
            get { return shyOpacity; }
            set
            {
                shyOpacity = value;
                RaisePropertyChanged();
            }
        }


        private double scrollerViewerOffset;
        public double ScrollViewerOffset
        {
            get { return scrollerViewerOffset; }
            set
            {
                Debug.Print(value.ToString());
                scrollerViewerOffset = value;
                if (scrollerViewerOffset > 0)
                {
                    ShyOpacity = 0.7;
                    ShyHeight = 80;
                    HeaderGridRow = 1;
                    GridTopRowHeight = 0;
                } else if (scrollerViewerOffset == 0)
                {
                    ShyOpacity = 1;
                    ShyHeight = 100;
                    HeaderGridRow = 0;
                    GridTopRowHeight = 100;
                }
            }
        }

        private int headerGridRow;
        public int HeaderGridRow
        {
            get { return headerGridRow; }
            set
            {
                headerGridRow = value;
                RaisePropertyChanged();
            }
        }

        private int gridTopRowHeight;

        public int GridTopRowHeight
        {
            get { return gridTopRowHeight; }
            set { gridTopRowHeight = value; RaisePropertyChanged();}
        }

    }
}

viewbasemodel:

using System.ComponentModel;
using System.Runtime.CompilerServices;


namespace scrollviewerShyHeader
{
    public abstract class ViewModelBase : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        protected virtual void RaisePropertyChanged([CallerMemberName] string propertyName = null)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}