鼠标滚动无法在具有wpf数据网格和其他UI元素的滚动查看器中工作

时间:2010-05-27 15:06:36

标签: c# wpf wpfdatagrid

我试图找出如何让wpf窗口上的鼠标滚动工作,其中包含scrollviewer和datagrid。 WPF和C#代码位于

之下
<ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid Grid.Row="0">

            <Border Name="DataGridBorder" BorderThickness="2"  Margin="1" CornerRadius="4" BorderBrush="#FF080757">
                <dg:DataGrid AutoGenerateColumns="False" Name="ValuesDataGrid" 
                         BorderThickness="0" CanUserResizeColumns="True" FontWeight="Bold" HorizontalScrollBarVisibility="Auto" 
                         CanUserReorderColumns="False" IsReadOnly="True" IsTextSearchEnabled="True" AlternationCount="2"
                         SelectionMode="Extended" GridLinesVisibility="All"                
                         HeadersVisibility="Column" CanUserAddRows="False" CanUserDeleteRows="False" CanUserResizeRows="False" CanUserSortColumns="False"
                         RowDetailsVisibilityMode="Collapsed"  SelectedIndex="0"
                         RowStyle="{StaticResource CognitiDataGridRowStyle}"
                         >

                    <dg:DataGrid.Columns>
                        <dg:DataGridTemplateColumn Header="Title" >
                            <dg:DataGridTemplateColumn.CellTemplate>
                                <DataTemplate>
                                    <StackPanel Orientation="Horizontal" >
                                        <TextBlock HorizontalAlignment="Left" VerticalAlignment="Center" Text="{Binding Path=Name}" FontWeight="Normal"  />
                                    </StackPanel>
                                </DataTemplate>
                            </dg:DataGridTemplateColumn.CellTemplate>
                        </dg:DataGridTemplateColumn>
                    </dg:DataGrid.Columns>
                </dg:DataGrid>
            </Border>
        </Grid>
        <Button Grid.Row="1" Height="90" >hello world</Button>
    </Grid>
</ScrollViewer>

和C#代码如下

 public partial class Window1 : Window
  {
     public Window1()
     {
        InitializeComponent();
        initialize();
      }

    public void initialize()
    {
        ObservableCollection<MyObject> testList = new ObservableCollection<MyObject>();

        for (int i = 0; i < 20; i++)
        {
            MyObject my = new MyObject("jack " + i);
            testList.Add(my);
        }

        ValuesDataGrid.ItemsSource = testList;



    }
}

public class MyObject
{
    public string Name { get; set; }



    public MyObject(string name)
    {
        Name = name;
    }
   }

我面临的问题是,当使用鼠标滚动时,它在按钮上方时工作正常,但只要我将鼠标指针移到网格上并尝试滚动,就没有任何反应。我可以直接移动scrollviewer的滚动条。我仍然是一个wpf新手,所以任何有关如何让鼠标滚动在数据网格上工作的帮助将不胜感激。我猜这应该有一个非常简单的解决方案,但我还没能弄清楚

12 个答案:

答案 0 :(得分:55)

我认为Dave的解决方案很好。但是,我提出的一个建议是在scrollviewer上而不是在datagrid上捕获PreviewMouseWheel事件。如果不这样做,您可能会注意到一些细微差别,具体取决于您是在滚动数据网格还是滚动条本身。原因是当鼠标悬停在滚动条上时,滚动查看器将处理滚动,而datagrid事件将在数据网格上方处理滚动。例如,在数据网格上滚动一个鼠标滚轮可能会使您在列表中更远,然后在滚动条上方滚动。如果你在scrollviewer预览事件中捕获它,滚动时都会使用相同的测量。此外,如果以这种方式捕获它,则不需要命名scrollviewer元素,因为您不需要对该对象的引用,因为您只需键入强制转换传递给scrollviewer PreviewMouseWheel事件的发送方对象。最后,我建议在事件结束时标记处理的事件,除非你因为某些原因需要在层次结构中的某个元素中捕获它。示例如下:

private void ScrollViewer_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
    {
        ScrollViewer scv = (ScrollViewer)sender;
        scv.ScrollToVerticalOffset(scv.VerticalOffset - e.Delta);
        e.Handled = true;
    }

答案 1 :(得分:13)

我假设DataGrid不需要滚动 - 在DataGrid上设置VerticalScrollBar =“None”。

DataGrid吞下鼠标滚动事件。

我发现使用PreviewMouseWheel事件滚动您要滚动的容器。您需要命名滚动查看器以更改垂直偏移。

private void DataGrid_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
    {
       scrollViewer.ScrollToVerticalOffset(scrollViewer.VerticalOffset-e.Delta);
    }

答案 2 :(得分:2)

我尝试过Don B的解决方案,它解决了在没有其他内部可滚动控件的情况下滚动数据网格的问题。

对于滚动查看器具有其他可滚动控件和数据网格作为子项的情况,则需要在主滚动查看器的事件处理程序的末尾不应将事件标记为已处理,因此它可能是也可以在内部可滚动控件中捕获,但是它具有副作用,即当滚动仅在内部可滚动控件上发生时,它也将出现在主滚动查看器上。

所以我更新了Dave的解决方案,区别在于如何找到滚动查看器,因此没有必要知道滚动查看器的名称:

private void DataGrid_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
{
    ScrollViewer scrollViewer = (((DependencyObject)sender).GetVisualParent<ScrollViewer>());
    scrollViewer.ScrollToVerticalOffset(scrollViewer.VerticalOffset - e.Delta);
}

答案 3 :(得分:2)

要启用触控支持,您可能还需要在ScrollViewer.PanningMode上将None设置为DataGrid,并将同一属性设置为VerticalFirst或顶级其他值{ {1}}

示例

ScrollViewer

当然,也可以使用Don B的答案所指示的<ScrollViewer VerticalScrollBarVisibility="Auto" Margin="5" PanningMode="VerticalFirst"> <DataGrid ScrollViewer.PanningMode="None" ItemsSource="{Binding Items}" /> </ScrollViewer> 事件来解决原始鼠标滚动问题。

PreviewMouseWheel

或者,您只需将以下附加属性设置为private static void ScrollViewer_PreviewMouseWheel(object sender, System.Windows.Input.MouseWheelEventArgs e) { var scrollViewer = (ScrollViewer)sender; scrollViewer.ScrollToVerticalOffset(scrollViewer.VerticalOffset - e.Delta); e.Handled = true; }

即可
ScrollViewer

<强>用法

public class TopMouseScrollPriorityBehavior
{
    public static bool GetTopMouseScrollPriority(ScrollViewer obj)
    {
        return (bool)obj.GetValue(TopMouseScrollPriorityProperty);
    }

    public static void SetTopMouseScrollPriority(ScrollViewer obj, bool value)
    {
        obj.SetValue(TopMouseScrollPriorityProperty, value);
    }

    public static readonly DependencyProperty TopMouseScrollPriorityProperty =
        DependencyProperty.RegisterAttached("TopMouseScrollPriority", typeof(bool), typeof(TopMouseScrollPriorityBehavior), new PropertyMetadata(false, OnPropertyChanged));

    private static void OnPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        var scrollViewer = d as ScrollViewer;
        if (scrollViewer == null)
            throw new InvalidOperationException($"{nameof(TopMouseScrollPriorityBehavior)}.{nameof(TopMouseScrollPriorityProperty)} can only be applied to controls of type {nameof(ScrollViewer)}");
        if (e.NewValue == e.OldValue)
            return;
        if ((bool)e.NewValue)
            scrollViewer.PreviewMouseWheel += ScrollViewer_PreviewMouseWheel;
        else
            scrollViewer.PreviewMouseWheel -= ScrollViewer_PreviewMouseWheel;
    }

    private static void ScrollViewer_PreviewMouseWheel(object sender, System.Windows.Input.MouseWheelEventArgs e)
    {
        var scrollViewer = (ScrollViewer)sender;
        scrollViewer.ScrollToVerticalOffset(scrollViewer.VerticalOffset - e.Delta);
        e.Handled = true;
    }
}

其中b:是包含此行为的命名空间

这样就不需要代码隐藏了,而你的应用程序纯粹是MVVM

答案 4 :(得分:1)

我看过这里发布的大多数解决方案,并且基本上所有的解决方案都是正确的,但是我认为我们可以应用一种最简单,更优雅的语法。

假设我们不需要滚动数据网格,而是想使用MainWindow滚动

允许“ Dave”和“ Vladim Tofan”回答

Private Void Scrlll(Object sebder, MouseWheelEventArgs e)
{
   var windows = (Window.GetWindow(this) as MainWindow).MainScroll;
   windows.ScrollToVerticalOffset(windows.VerticalOffset - e.Delta);
}

对不起,英语不好。

答案 5 :(得分:0)

@ fjch1997,我使用了您的解决方案,效果很好。 我发现只有一个问题。与@Vadim Tofan的评论有关:

  

对于滚动查看器具有其他可滚动项作为子项的情况   控件和数据网格,则要求该事件不应   在主事件处理程序的末尾被标记为已处理   滚动查看器,因此它也可以在内部滚动窗口中捕获   控制,但是有副作用,即滚动时   仅发生在内部滚动控件上,也将发生在   主滚动查看器。

我也尝试删除e.Handled = true语句,但是效果不佳-两个滚动条同时移动。因此,最后我将一点事件处理程序方法增强为以下方法:

private static void ScrollViewer_PreviewMouseWheel(object sender, System.Windows.Input.MouseWheelEventArgs e)
{
    ScrollViewer scrollViewer = (ScrollViewer)sender;
    FrameworkElement origicalControlSender = e.OriginalSource as FrameworkElement;

    ScrollViewer closestScrollViewer = origicalControlSender.GetParent<ScrollViewer>();

    if (closestScrollViewer != null && !ReferenceEquals(closestScrollViewer, scrollViewer))
    {
        return;
    }

    scrollViewer.ScrollToVerticalOffset(scrollViewer.VerticalOffset - e.Delta);
    e.Handled = true;
}

public static T GetParent<T>(this FrameworkElement control)
    where T : DependencyObject
{
    FrameworkElement parentElement = control?.Parent as FrameworkElement;

    if (parentElement == null)
    {
        return null;
    }

    T parent = parentElement as T;

    if (parent != null)
    {
        return parent;
    }

    return GetParent<T>(parentElement);
}

这现在可以防止外部滚动条在内部ScrollViewer存在的情况下滚动。

答案 6 :(得分:0)

对Don B解决方案的改进是避免使用ScrollToVerticalOffset

scv.ScrollToVerticalOffset(scv.VerticalOffset - e.Delta);

VerticalOffset - Delta带来令人震撼的体验。 ScrollViewer在使运动更平滑方面投入了很多思想。我认为它还可以根据dpi和其他因素来缩小增量...

我发现最好捕获并处理PreviewMouseWheelEvent并将MouseWheelEvent发送到预期的ScrollViewer。我的Don B解决方案版本如下。

private void ScrollViewer_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
{
    var eventArg = new MouseWheelEventArgs(e.MouseDevice, e.Timestamp, e.Delta);
    eventArg.RoutedEvent = UIElement.MouseWheelEvent;
    eventArg.Source = e.Source;

    ScrollViewer scv = (ScrollViewer)sender;
    scv.RaiseEvent(eventArg);
    e.Handled = true;
}

答案 7 :(得分:0)

这里是创建用于滚动DataGrid的WPF行为的较大示例。

首先定义以下基类,以将框架元素与行为类及其行为实现粘合在一起。

using System.Diagnostics.CodeAnalysis;
using System.Windows;
using System.Windows.Input;

namespace SomeAcme.Client.Infrastructure
{


    /// <summary>
    /// Behavior handler class for creating WPF behaviors.
    /// </summary>  
     [ExcludeFromCodeCoverage] 
    public class BehaviorHandler<TAssociatedObject, TBehaviorClass> 
        where TAssociatedObject: DependencyObject
        where TBehaviorClass : class, IAssociationBehavior, new()
    {

        public BehaviorHandler()
        {
        }

        public static TBehaviorClass GetBehavior(DependencyObject obj)
        {
            if (obj == null)
                return null; 

            return (TBehaviorClass)obj.GetValue(BehaviorProperty);
        }

        public static void SetBehavior(DependencyObject obj, TBehaviorClass value)
        {
            if (obj != null)
            {
                obj.SetValue(BehaviorProperty, value);
            }
        }

        // Using a DependencyProperty as the backing store for Behavior.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty BehaviorProperty =
            DependencyProperty.RegisterAttached("Behavior", typeof(TBehaviorClass), typeof(object), new FrameworkPropertyMetadata(null, FrameworkPropertyMetadataOptions.Inherits));


        public void FindOrCreateBehaviorOnDemand(DependencyObject dependencyObject)
        {
             //Apply the behavior 
             TBehaviorClass behavior = FindOrCreateBehavior(dependencyObject);
             if (behavior != null)
             {
                 dependencyObject.SetValue(BehaviorProperty, behavior); 
             }
        }

        public TBehaviorClass FindOrCreateBehavior(DependencyObject dependencyObject)
        {
            if (dependencyObject == null)
                return null;
            var associatedObject = dependencyObject;
            if (associatedObject == null)
                return null;
            var behavior = dependencyObject.GetValue(BehaviorProperty) as TBehaviorClass;
            if (behavior == null)
            {
                var behaviorAssociated = new TBehaviorClass();
                if (behaviorAssociated == null)
                    return null;
                behaviorAssociated.InitializeAssociation(associatedObject, AssociatedCommands);
                return behaviorAssociated;
            }
            else
            {
                return behavior;
            }
        } //TBehaviorClass FindOrCreateBehavior 

        /// <summary>
        /// Set the associated commands to pass into the WPF behavior, if desired
        /// </summary>
        public ICommand[] AssociatedCommands { get; set; }

    }

}

这看起来有些复杂,但是在将行为类与框架元素粘合在一起时,它简化了样板代码。在这种特殊情况下,我们将不需要使用关联的命令。

我们的滚动查看器行为如下:

    using SomeAcme.Client.Infrastructure;
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Input;

    namespace SomeAcme.Client.Infrastructure
    {

        public static class ScrollViewerMouseWheelScrollBehavior
        {


                public static string GetUseMouseScrollForScrollViewer(DependencyObject obj)
                {
                    if (obj != null)
                    {
                        return (string)obj.GetValue(UseMouseScrollForScrollViewerProperty);
                    }
                    else
                        return null;
                }

                public static void SetUseMouseScrollForScrollViewer(DependencyObject obj, string value)
                {
                    if (obj != null)
                    {
                        obj.SetValue(UseMouseScrollForScrollViewerProperty, value);
                    }
                }


 public static readonly DependencyProperty UseMouseScrollForScrollViewerCommandProperty =
                    DependencyProperty.RegisterAttached("UseScrollForScrollViewer", typeof(string), typeof(ScrollViewerMouseWheelScrollBehavior),
                        new PropertyMetadata(new PropertyChangedCallback(OnUseScrollForScrollViewerSet)));

                public static void OnUseScrollForScrollViewerSet(DependencyObject dependencyObject, DependencyPropertyChangedEventArgs eventArgs)
                {
                    bool useScroll;
                    bool.TryParse(eventArgs.NewValue?.ToString(), out useScroll);
                    if (useScroll)
                    {
                        var behaviorHandler =
                            new BehaviorHandler<ScrollViewer, ScrollViewerMouseScrollBehaviorImplementation>();
                        //behaviorHandler.AssociatedCommands = 
                        //    new Microsoft.Practices.Prism.Commands.DelegateCommand<object>[] { (Microsoft.Practices.Prism.Commands.DelegateCommand<object>)eventArgs.NewValue };
                        behaviorHandler.FindOrCreateBehaviorOnDemand(dependencyObject);
                    }
                }

            }

    }

    namespace SomeAcme.Client.Infrastructure
    {
        public class ScrollViewerMouseScrollBehaviorImplementation : IAssociationBehavior
        {
            public void InitializeAssociation(DependencyObject associatedObject, params ICommand[] commands)
            {
                //TODO: Add commands to associate
                var scrollViewer = associatedObject as ScrollViewer;
                if (scrollViewer != null)
                {
                    scrollViewer.PreviewMouseWheel += ScrollViewer_PreviewMouseWheel;
                }
            }

            private void ScrollViewer_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
            {
                var scrollViewer = sender as ScrollViewer;
                if (scrollViewer != null)
                {
                    scrollViewer.ScrollToVerticalOffset(scrollViewer.VerticalOffset - e.Delta);
                }
            }
        }
    }

然后在XAML中,我们可以首先定义名称空间:

xmlns:local="clr-namespace:SomeAcme.Client.Infrastructure"
xmlns:sys="clr-namespace:System;assembly=mscorlib"

最后,我们准备通过使用XAML中的WPF行为来使用鼠标滚轮滚动。

..

 <TabControl Grid.Row="1">
        <TabItem Header="Skjemafelter">
            <ScrollViewer Height="700" local:ScrollViewerMouseWheelScrollBehavior.UseMouseScrollForScrollViewer="{x:Static sys:Boolean.TrueString}">
                <ListView x:Name="ColumnsListView" ItemsSource="{Binding CurrentFields}">
                    <ListView.View>
                        <GridView>

我已经测试并验证了此方法的有效性。对于使用WPF应用程序的开发人员来说,利用WPF行为可以将代码中的代码量保持在最小位数以下,并忠于MVVM方法。

答案 8 :(得分:0)

Grid具有内置的ScrollPanel,所以用ScrollPanel打包对我来说根本不起作用(使固定高度的Grid成为不可能,因为我希望它可以与应用程序的其余部分很好地调整大小)

我所做的是这里一些较高评价的解决方案的组合,但是本质上是要摆脱ScrollPanel,然后将DataGrid的PreviewMouseEvent通过管道传递回实际处理滚动的父控件(在我的情况下是网格)。

    private void DataGrid_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
    {

        MouseWheelEventArgs eventArg = new MouseWheelEventArgs(e.MouseDevice, e.Timestamp, e.Delta)
        {
            RoutedEvent = MouseWheelEvent, Source = e.Source
        };
        DependencyObject parent = VisualTreeHelper.GetParent((DependencyObject) sender);

        while (parent != null && !(parent is Grid))
        {
            parent = VisualTreeHelper.GetParent(parent);
        }

        if (parent != null)
        {
            Grid grid = (Grid) parent;
            grid.RaiseEvent(eventArg);
        }

        e.Handled = true;
    }

答案 9 :(得分:0)

我发现了这个:http://wpfthoughts.blogspot.com/2014/05/datagrid-vertical-scrolling-issues.html 并认为我应该在这里添加它。 “如果您的目标是 Framework 4.5,DataGrid 的内部 VirtualizingPanel 上有一个新的依赖对象,称为 ScrollUnit,可以设置为 Item(默认)或 Pixel。如果我们稍微修改 XAML,我们可以看到它是如何工作的。”

<DataGrid Name="DG" ItemsSource="{Binding B0}" AutoGenerateColumns="False" IsReadOnly="true" RowDetailsVisibilityMode="Visible" Width="200" 
      Height="100" VirtualizingPanel.ScrollUnit="Pixel">

答案 10 :(得分:0)

我知道已经有一段时间了,但我遇到了同样的问题并使用 DockPanel 解决了它

jhipster upgrade --force

出于某种原因,这会像处理魅力一样处理鼠标滚轮事件。

答案 11 :(得分:-1)

我发现ScrollViewer无法连接,这意味着如果它是连接的,就像在你的情况下Grid在ScrollViewer标签下开始,在Grid中我们有DataGrid,在DataGrid中再次设置了ScrollViewer属性。即

   

  <Grid>
     <Grid.RowDefinitions>
        <RowDefinition Height="30" />
        <RowDefinition Height="45" />
        <RowDefinition Height="100*" />
        <RowDefinition Height="105" />
     </Grid.RowDefinitions>
     <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
     </Grid.ColumnDefinitions>

     <Label Grid.Row="0"
            Grid.Column="0"
            Margin="10,0,0,0"
            HorizontalAlignment="Left"
            VerticalAlignment="Center"
            FontWeight="Bold"
            Content="Vessel: " />
     <TextBox Height="30"
              Width="300"
              Margin="70,0,0,0"
              HorizontalAlignment="Left"
              BorderThickness="1,1,1,1"
              IsReadOnly="True"
              Name="txtVessel" />

     <Label  Grid.Row="0"
             Grid.Column="2"
             Margin="0,0,185,0"
             HorizontalAlignment="Right"
             VerticalAlignment="Center"
             FontWeight="Bold"
             Content="Month:" />

     <StackPanel Orientation="Horizontal"
                 Grid.Row="0"
                 Grid.Column="2"
                 Margin="0,0,0,0"
                 HorizontalAlignment="Right">

        <ComboBox BorderThickness="2"
                  HorizontalAlignment="Right"
                  Name="CmbMonth"
                  VerticalAlignment="Center"
                  Width="90" />
        <ComboBox BorderThickness="2"
                  HorizontalAlignment="Right"
                  Margin="5,0,0,0"
                  Name="CmbYear"
                  VerticalAlignment="Center"
                  Width="90" />

     </StackPanel>

     <Grid Grid.Row="1"
           Grid.ColumnSpan="2">
        <Grid.RowDefinitions>
           <RowDefinition Height="45" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
           <ColumnDefinition Width="30" />
           <ColumnDefinition Width="220" />
           <ColumnDefinition Width="80" />
           <ColumnDefinition Width="80" />
           <ColumnDefinition Width="80" />
           <ColumnDefinition Width="80" />
           <ColumnDefinition Width="120" />
           <ColumnDefinition Width="120" />
           <ColumnDefinition Width="140*" />
        </Grid.ColumnDefinitions>

        <Border BorderBrush="Black"
                BorderThickness="0,1,1,1"
                Grid.Row="0"
                Grid.Column="0" />
        <Border BorderBrush="Black"
                BorderThickness="0,1,1,1"
                Grid.Row="0"
                Grid.Column="1" />
        <Border BorderBrush="Black"
                BorderThickness="0,1,1,1"
                Grid.Row="0"
                Grid.Column="2" />
        <Border BorderBrush="Black"
                BorderThickness="0,1,1,1"
                Grid.Row="0"
                Grid.Column="3" />
        <Border BorderBrush="Black"
                BorderThickness="0,1,1,1"
                Grid.Row="0"
                Grid.Column="4" />
        <Border BorderBrush="Black"
                BorderThickness="0,1,1,1"
                Grid.Row="0"
                Grid.Column="5" />
        <Border BorderBrush="Black"
                BorderThickness="0,1,1,1"
                Grid.Row="0"
                Grid.Column="6" />
        <Border BorderBrush="Black"
                BorderThickness="0,1,1,1"
                Grid.Row="0"
                Grid.Column="7" />
        <Border BorderBrush="Black"
                BorderThickness="0,1,1,1"
                Grid.Row="0"
                Grid.Column="8" />

        <Label  Grid.Row="0"
                Grid.Column="1"
                Margin="0,0,0,0"
                HorizontalAlignment="Center"
                VerticalAlignment="Center"
                FontWeight="Bold"
                Content="Item" />

        <Label  Grid.Row="0"
                Grid.Column="2"
                Margin="0,0,0,0"
                HorizontalAlignment="Center"
                VerticalAlignment="Center"
                FontWeight="Bold"
                Content="Maker" />

        <Label  Grid.Row="0"
                Grid.Column="3"
                Margin="0,0,0,0"
                HorizontalAlignment="Center"
                VerticalAlignment="Center"
                FontWeight="Bold"
                Content="Model" />

        <Label  Grid.Row="0"
                Grid.Column="4"
                Margin="0,0,0,0"
                HorizontalAlignment="Center"
                VerticalAlignment="Center"
                FontWeight="Bold"
                Content=" Part No.&#x0a;Serial No." />

        <Label  Grid.Row="0"
                Grid.Column="5"
                Margin="0,0,0,0"
                HorizontalAlignment="Center"
                VerticalAlignment="Center"
                FontWeight="Bold"
                Content="Condition" />

        <Label  Grid.Row="0"
                Grid.Column="6"
                Margin="0,0,0,0"
                HorizontalAlignment="Center"
                VerticalAlignment="Center"
                FontWeight="Bold"
                Content="   Onboard&#x0a; Calibr/Test" />

        <Label  Grid.Row="0"
                Grid.Column="7"
                Margin="0,0,0,0"
                HorizontalAlignment="Center"
                VerticalAlignment="Center"
                FontWeight="Bold"
                Content="     Shore&#x0a; Callibration" />

        <Label  Grid.Row="0"
                Grid.Column="8"
                Margin="0,0,0,0"
                HorizontalAlignment="Center"
                VerticalAlignment="Center"
                FontWeight="Bold"
                Content="Remarks" />

     </Grid>

     <Border Grid.Row="2"
             Grid.ColumnSpan="2">
        <ScrollViewer Grid.Row="2"
                      Grid.ColumnSpan="2"
                      CanContentScroll="True"
                      HorizontalScrollBarVisibility="Disabled"
                      VerticalScrollBarVisibility="Auto"
                      Name="ScrollViewer3"
                      Margin="0,0,0,0">
           <Grid Name="grdOnBoardCalibrationRecord"
                 Margin="0,0,0,0">
              <Grid.ColumnDefinitions>
                 <ColumnDefinition Width="30"></ColumnDefinition>
                 <ColumnDefinition Width="220"></ColumnDefinition>
                 <ColumnDefinition Width="80"></ColumnDefinition>
                 <ColumnDefinition Width="80"></ColumnDefinition>
                 <ColumnDefinition Width="80"></ColumnDefinition>
                 <ColumnDefinition Width="80"></ColumnDefinition>
                 <ColumnDefinition Width="120"></ColumnDefinition>
                 <ColumnDefinition Width="120"></ColumnDefinition>
                 <ColumnDefinition Width="140*"></ColumnDefinition>
              </Grid.ColumnDefinitions>
              <Border Grid.Column="0"
                      BorderThickness="1,0,1,1"
                      BorderBrush="Black"
                      Grid.RowSpan="26"></Border>
              <Border Grid.Column="1"
                      BorderThickness="0,1,1,1"
                      Grid.RowSpan="26"></Border>
              <Border Grid.Column="2"
                      BorderThickness="0,1,1,1"
                      Grid.RowSpan="26"></Border>
              <Border Grid.Column="3"
                      BorderThickness="0,1,1,1"
                      Grid.RowSpan="26"></Border>
              <Border Grid.Column="4"
                      BorderThickness="0,1,1,1"
                      Grid.RowSpan="26"></Border>
              <Border Grid.Column="5"
                      BorderThickness="0,1,1,1"
                      Grid.RowSpan="26"></Border>
              <Border Grid.Column="6"
                      BorderThickness="0,1,1,1"
                      Grid.RowSpan="26"></Border>
              <Border Grid.Column="7"
                      BorderThickness="0,1,1,1"
                      Grid.RowSpan="26"></Border>
              <Border Grid.Column="8"
                      BorderThickness="0,1,1,1"
                      Grid.RowSpan="26"></Border>
           </Grid>
        </ScrollViewer>
     </Border>
     <Grid Grid.Row="3"
           Grid.ColumnSpan="2">
        <Grid.RowDefinitions>
           <RowDefinition Height="30"></RowDefinition>
           <RowDefinition Height="30"></RowDefinition>
           <RowDefinition Height="40"></RowDefinition>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
           <ColumnDefinition Width="*"></ColumnDefinition>
        </Grid.ColumnDefinitions>

        <TextBox Grid.Row="0"
                 Grid.Column="0"
                 Height="30"
                 Width="300"
                 TextAlignment="Center"
                 Background="Gray"
                 IsReadOnly="True"
                 Margin="0,0,0,0"
                 HorizontalAlignment="Right"
                 VerticalAlignment="Bottom"
                 BorderThickness="1,1,1,1"
                 Name="txtChiefEngineer" />
        <Label  Grid.Row="1"
                Grid.Column="1"
                Margin="0,0,100,0"
                HorizontalAlignment="Right"
                VerticalAlignment="Center"
                FontWeight="Bold"
                Content="Chief Engineer" />
        <StackPanel Orientation="Horizontal"
                    Grid.Row="2"
                    Margin="0,0,0,0">
           <Label Name="lblonshorecomment"
                  Content=" Shore Comment : "
                  HorizontalAlignment="Center"
                  Margin="5,0,0,0"
                  FontWeight="Bold"
                  VerticalAlignment="Center"
                  FontFamily="Calibri"
                  FontStyle="Normal"
                  FontSize="14"></Label>
           <TextBox  BorderThickness="1"
                     FontWeight="Normal"
                     IsReadOnly="True"
                     Height="44"
                     Width="878"
                     TextWrapping="Wrap"
                     AcceptsReturn="True"
                     HorizontalAlignment="left"
                     Margin="0,0,0,0"
                     Name="txtShoreComment"
                     VerticalAlignment="Center" />
        </StackPanel>

     </Grid>
  </Grid>