استایل کنترل DataGrid

[PetekDincos]

با سلام
اگر امکانش است در مورد کنترل DataGrid دوستانی که با تمام زوایایی Style این کنترل آشنایی دارند یه آموزش قرار بدند تا بقیه استفاده کنند با تشکر

[مهدی فرزاد]

سلام مجدد
شاید اکثر دوستان آشنایی لازم رو دارن اما تهیه یک آموزش کار وقت گیری هست
من چند لینک براتون میگذارم ببینید
و اگه خدا بخواد و وقت کنم برای آموزش در خدمتم


http://blogs.msdn.com/b/jaimer/archi...-datagrid.aspx

http://blogs.msdn.com/b/jaimer/archi...id-part-1.aspx

این لینک رو تا انتها ببینید http://www.codeproject.com/KB/WPF/WP...dExamples.aspx

http://www.wpftutorial.net/DataGrid.html

[PetekDincos]

با سلام
من تو DataGrid برای Column هام از DataGridTemplateColumn استفاده می کنم به صورت زیر

<DataGridTemplateColumn Header="Column 01" Width="150" MinWidth="100" MaxWidth="150">

<DataGridTemplateColumn.CellTemplate>

<DataTemplate>

<TextBlock Background="Transparent" Text="{Binding Path=Column01}" />

</DataTemplate>

</DataGridTemplateColumn.CellTemplate>

<DataGridTemplateColumn.CellEditingTemplate>

<DataTemplate>

<Grid FocusManager.FocusedElement="{Binding ElementName=txt_Column01}">

<TextBox Background="Transparent" Name="txt_Column01" Text="{Binding Path=Column01}" GotFocus="TextBox_GotFocus" KeyDown="TextBox_KeyDown" BorderThickness="0" Margin="0" TextChanged="TextBox_TextChanged" MaxLength="20" />

</Grid>

</DataTemplate>

</DataGridTemplateColumn.CellEditingTemplate>

</DataGridTemplateColumn>

و وقتی به کنترل دیتاگراید استایل می دهم در قسمت موبوط به انتخاب سطر رنگ سطر انتخاب شده به رنگ آبی می شود و نمی دونم این رنگ آبی را از کدوم قسمت تغییر بدم و در ضمن خاصیت SelectionUnit دیتاگرایدم CellOrRowHeader است و سوال دوم مربوط به این است که آیا می شود برای یک کنترل هم در قسمت Resource خود فرم و هم در فایل ResourceDictionary مربوط به برنامه استایل تعریف کرد و این استایل ها موقع اجرای برنامه با هم Merge شده و به کنترل اعمال شوند با تشکر

[مهدی فرزاد]

سلام
شما باید یک استایل برای DataGridCell تعریف کنید و یک استایل برای DataGridRow تعریف کنید مثلا برای DataGridCell

 <Style x:Key="{x:Type dg:DataGridCell}" TargetType="{x:Type dg:DataGridCell}">

            <Setter Property="Background" Value="Transparent" />

            <Setter Property="BorderBrush" Value="Transparent" />

            <Setter Property="BorderThickness" Value="0" />

            <Setter Property="Template">

                <Setter.Value>

                    <ControlTemplate TargetType="{x:Type dg:DataGridCell}">

                        <Border Padding="5"  Background="{TemplateBinding Background}" 

                              BorderBrush="{TemplateBinding BorderBrush}"  

                              BorderThickness="{TemplateBinding BorderThickness}" 

                              SnapsToDevicePixels="True">

                            <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>

                        </Border>

                    </ControlTemplate>

                </Setter.Value>

            </Setter>

            <Style.Triggers>

                <Trigger Property="IsKeyboardFocusWithin" Value="True">

                    <Setter Property="BorderBrush" Value="{DynamicResource {x:Static dg:DataGrid.FocusBorderBrushKey}}" />

                </Trigger>

                <Trigger Property="IsSelected" Value="true">

                    <Setter Property="Background" Value="{StaticResource SelectedBrush}" />

                </Trigger>

            </Style.Triggers>

        </Style>

و

برای DataGridRow

<Style TargetType="{x:Type dg:DataGridRow}">

  <Setter Property="Foreground" Value="White" />

  <Setter Property="Background" Value="#7F000000" />

  <Setter Property="BorderThickness" Value="0" />

  <Setter Property="BorderBrush" Value="#616161" />

  <Setter Property="DetailsVisibility" Value="Collapsed"/>

  <Setter Property="FontFamily" Value="Tahoma"/>

  <Setter Property="FontSize" Value="10.667"/>

  <Setter Property="HorizontalAlignment" Value="Stretch"/>

            

  <Style.Triggers>

   <Trigger Property="IsMouseOver" Value="true">

    <Setter Property="Background" Value="{StaticResource RolloverBrush}" />

   </Trigger>

   <Trigger Property="IsSelected" Value="true">

    <Setter Property="Background" Value="{StaticResource SelectedBrush}" />

   </Trigger>

  </Style.Triggers>

 </Style>

در دو کد با لا به این قسمت دقت کنید

 <Trigger Property="IsSelected" Value="true">

                    <Setter Property="Background" Value="{StaticResource SelectedBrush}" />

                </Trigger>

نکته دقت کنید من در دو کد بالا برای رنگ براش در حالت Select این رنگ رو در یک ریسورس جدا گانه با نام SelectedBrush تعریف کردم
برای قسمت دوم سئوال اگه منظور شما اینه که مثلا دیتا تمپلت رو توی فرم تعریف کنید ولی استایل DataGridCell استایل DataGridRow رو در ریسورس دیکشنری بله میشه این کار رو کرد

[PetekDincos]

با سلام
ممنون از توجه هاتتون آقای Mehdi550u
کد بالا برای استایل DataGridCell و DataGridRow برای همه Column ها به جز DataGridTemplateColumn درست کار می کنه اما برای TemplateColumn درست کار نمی کنه و همون رنگ آبی پیش فرض وقتی یک Cell در یک Row انتخاب می شه به Cell های بقیه اون Row می افته با تشکر

[مهدی فرزاد]

سلام
شما باید برای اون استایل هایی که گفتم یک Key تعریف کنید مثلا

 <Style x:Key="MyDGCellStyle" TargetType="{x:Type DataGridCell}">

حالا توی کد DataGridTemplateColumn اونو به این شکل تعریف کنید

<DataGridTemplateColumn  Header="Column 01" Width="150" MinWidth="100" MaxWidth="150" CanUserSort="False" CellStyle="{DynamicResource MyDGCellStyle}">

اگر از نرم افزار Blend استفاده کنید خیلی راحت تر و قابل لمس تر با این استایل ها آشنا میشید

ولی من به شخصه از DataGridTemplateColumn استفاده نمیکنم

فراموش کردم بگم چون برای اون استایل Key تعریف شده دیگه پیشفرض استایل بقیه سل ها نیست و برای گرید هم باید اونو معرفی کنید
این کد رو تست کنید و نتیجه رو بگید چون من تست نکردم

[PetekDincos]

سلام
شما باید برای اون استایل هایی که گفتم یک Key تعریف کنید مثلا

 <Style x:Key="MyDGCellStyle" TargetType="{x:Type DataGridCell}">

حالا توی کد DataGridTemplateColumn اونو به این شکل تعریف کنید

<DataGridTemplateColumn Header="Column 01" Width="150" MinWidth="100" MaxWidth="150" CanUserSort="False" CellStyle="{DynamicResource MyDGCellStyle}">

اگر از نرم افزار Blend استفاده کنید خیلی راحت تر و قابل لمس تر با این استایل ها آشنا میشید

ولی من به شخصه از DataGridTemplateColumn استفاده نمیکنم

فراموش کردم بگم چون برای اون استایل Key تعریف شده دیگه پیشفرض استایل بقیه سل ها نیست و برای گرید هم باید اونو معرفی کنید
این کد رو تست کنید و نتیجه رو بگید چون من تست نکردم

با سلام مجدد
درست شد اما نمی شه این کار رو بدون اینکه Key تعریف کنیم انجام بدیم چون من DataGrid های دیگه ای دارم که استایل را ننوشتم چون قبلا به صورت default تعریف شده بود با تشکر

[مهدی فرزاد]

می تونید یک کپی از استایل داشته باشید و برای اون کپی key تعریف کنید واین جوریی بقیه تنظیمات قبلی بهم نمیخوره
(این پیشنهاده فقط)

[PetekDincos]

با سلام
من برای ایجاد رویداد GotFocus برای DataGridCell هام در Resource خود فرم یک Style به صورت زیر تعریف می کنم

<Style x:Key="DataGridCellStyle" TargetType="{x:Type DataGridCell}" >

<EventSetter Event="GotFocus" Handler="DataGridCell_GotFocus" />
</Style>

 

و یک Style نیز در ResourceDictionary برنامم برای DataGridCell برای کارهای گرافیکی مربوط به این کنترل تعریف می کنم و حالا موقعی که Column های دیتاگراید را تعریف می کنم در خصوصیت CellStyle مربوط به هر Column دو حالت وجود دارد که یا به صورت DynamicResource از فایل ResourceDictionary و یا به صورت StaticResource از Resource خود فرم خاصیت CellStyle را بایند کنم اما من می خوام هر دو اینها با هم اعمال بشن و سوال دوم اینکه برای اینکه سطرهای دیتاگراید را شماره گذاری کنم در رویداد LoadingRow دیتاگراید از کد زیر استفاده می کنم

privatevoid DataGrid_LoadingRow(object sender, DataGridRowEventArgs e)

{

e.Row.Header = (e.Row.GetIndex() + 1).ToString();

}

من می خوام وقتی یک سطر از دیتاگراید را کاربر حذف کرد این شماره سطرها خودشون شیفت داده بشن با تشکر

[مهدی فرزاد]

نمیشه این دو استایل هم زمان اعمال بشه
توی اونت مورد نظر چه عملی انجام میشه؟؟

بعد از هر بار delete کردن اون مقادیر رو از دوباره محاسبه کنید

[PetekDincos]

با سلام
پس چطور می شه مجزا از استایل به DataGridCell ها رویداد GotFocus رو داد

[مهدی فرزاد]

من نمیدونم یا این فکوس چکار میخواید بکنید چون شاید این کار رو بشه از روش دیگه هم انجام داد و صورت مسئله رو جوری دیگه نگاه کرد
مثلا شاید بشه برای اون یک دیتا تمپلنت بجای استایل نوشت و توی اون اونت فکوس رو مثلا بای تکس بلاکی که مقدار اون سل رو نشون میده تعریف کرد
اگه بتونید یک نمونه از دیتا گرید رو به همرا دیتا بیس که بهش بایند کردید بگذارید که من بتونم اونو بررسی کنم میتونم بهتر راهنمایتون کنم
من با برداشتهای خودم دام جواب میدم

[PetekDincos]

با سلام آقای Mehdi550u
در تعریف استایل DataGridCell به این صورت می توان در تگ EventSetter استایل رویدادهای مربوط به اون کنترل را تعریف کرد من برای رویدادهای مربوط به DataGridCell مثلا PreviewMouseLeftButtonDown برای این استفاده می کنم که چون در DataGridTemplateColumn ها برای اینکه موقع کلیک بر روی DataGridCell به حالت Edit بره بایستی دابل کلیک کرد اما برای اینکه با یک کلیک به حالت Edit بره از این رویداد استفاده می کنم به این صورت

privatevoid DataGridCell_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)

{

DataGridCell cell = sender asDataGridCell;

if (!cell.IsEditing)

{

if (!cell.IsFocused)

cell.Focus();

if (!cell.IsSelected)

cell.IsSelected = true;

}

}

و برای استفاده از این کد به خود کنترل DataGridCell نیاز است و یا در خود رویداد GotFocus از کد زیر برای خواسته هام استفاده می کنم

privatevoid DataGridCell_GotFocus(object sender, RoutedEventArgs e)

{

DataGridCell Cells = (DataGridCell)sender;

this.DataGrid.SelectedItem = Cells.DataContext;

this.View.MoveCurrentToPosition(DataGrid.SelectedIndex  );

}

چون در دیتاگرایدم می خوام کاربر خودش داده وارد کنه و فقط برای نمایش نیست و برای مقدار دهی متغییرها یا آبجکت های مورد نیازم به خود DataGridCell نیاز دارم با تشکر

[PetekDincos]

بعد از هر بار delete کردن اون مقادیر رو از دوباره محاسبه کنید

با سلام
من برای انجام این کار چیکار باید بکنم

[مهدی فرزاد]

سلام
من از این روش استفاده کردم
ابتدا یک متغیر از نوع int تعریف کردم به نام intCout
حالا بعد از اون کدی رو که نوشتید یک خط بهش اضافه کردم (خط قرمز رنگ)

privatevoid personalDataGrid_LoadingRow(object sender, DataGridRowEventArgs e)

{

e.Row.Header = (e.Row.GetIndex() + 1).ToString();

intCout = personalDataGrid.Items.Count;

}

برای اینکه تعداد سطر ها رو در متغییر ذخیره کنه

حالا در متد SelectionChanged دیتا گرید چک میکنیم اگر تعداد سطر ها از متغییر کمتر بود یعنی سطر پاک شده بود پس دیتا گرید رو رفرش میکنیم
کد زیر

privatevoid personalDataGrid_SelectionChanged(object sender, SelectionChangedEventArgs e)

{

if (intCout > personalDataGrid.Items.Count)

personalDataGrid.Items.Refresh();

}

(نکته وقتی سطری از دیتا گرید پاک شود حتما SelectionChanged انتفاق می افتد )

فایل ضمیمه را ملاحظه بفرمایید
در فایل ضمیمه یک سطر از دیتا گرید را انتخاب کرده و با دکمه Delete کیبورد سطر را پاک کنید و نتیجه را ببینید
کا فیست بعد از کد و در همان دستور IF در روشی که من دیتا گرید را پر کردم (Linq to SQL و استفاده از CollectionViewSource)بنویسید

  db.SubmitChanges();

تا این اطلاعات در دیتا بیس هم ذخیره گردد

[PetekDincos]

با سلام
من در یک دیتاگراید دو تا Column دارم که به صورت DataGridTemplateColumn است و برای این دیتاگرایدم استایل تعریف کردم وقتی با برنامه نویسی فوکوس را از آخرین سطر و آخرین Column به یه سطر جدید انتقال می دم استایل DataGridCell اون Cell ای که فوکوس رو از اون انتقال دادم به حالت اولیه اش بر نمی گرده با تشکر

[مهدی فرزاد]

سلام
شما باید در تعریف استایل هاتون برای حالتی که فکوس برابر false میشه هم تعریفی داشته باشید

[PetekDincos]

سلام
شما باید در تعریف استایل هاتون برای حالتی که فکوس برابر false میشه هم تعریفی داشته باشید

با سلام
چون Column1 فوکوس رو می گیره استایل DataGridCell اجرا می شه و زمانیکه فوکوس به Column2 می ره استایل Column1 به حالت اولیه بر می گرده و فقط در حالتی که فوکوس از انتهای یک سطر به ابتدای سطر جدید می ره این اتفاق می افته با تشکر

[مهدی فرزاد]

سلام
در اون استایل DataGridCellStyle
شما یک تنظیم برای IsEditing درست کردید به شکل زیر

 <Trigger Property="IsEditing" Value="True">

                                <Setter Property="Background" TargetName="border" Value="#FFF7EABA"/>

                                <Setter Property="BorderBrush" TargetName="border" Value="#FFFFC80B"/>

                                <Setter Property="VerticalAlignment" TargetName="contentPresenter" Value="Center"/>

                                <Setter Property="BorderThickness" TargetName="border" Value="1"/>

                            </Trigger>

یکی دیگه هم برای حالت IsFoucsed= fasle به شکل زیر درست کنید

 <Trigger Property="IsFocused" Value="False">

                             <Setter Property="Background" TargetName="border" Value="{x:Null}"/>

                                <Setter Property="BorderBrush" TargetName="border" Value="{x:Null}"/>

          </Trigger>

البته این گرید یک مشکل دیگه هم داشت اگر هیچ سلی رو کلیک نکرده باشید و دکمه Tab رو بزنید اون سلی که فکوس رو میگیره فونتش بی رنگ میشه
برای رفع این مشکل در همون DataGridCellStyle در قسمت زیر

<Trigger Property="IsKeyboardFocusWithin" Value="True">

           <Setter Property="BorderBrush" Value="{DynamicResource {x:Static DataGrid.FocusBorderBrushKey}}"/>

                    </Trigger>

این تگ رو اضافه کنید

 <Setter Property="Foreground" Value="Black"/>

[PetekDincos]

با سلام
وقتی در استایل DataGridCell از Trigger IsFocus استفاده می کنی Trigger IsEditing کار نمی کنه و من می خوام در حالتی که DataGridCell به حالت Edit می ره استایلش با DataGridRow یکی نباشه و سوال دوم درباره Alternative Row Background که نتونستم درستش کنم اگر امکانش است برای این مورد هم راهنماییم کنید و آیا برای اینکه استایل DataGridCell را در ResourceDictionary قرار بدم راهی پیدا کردید با تشکر آقای مهدی فرزاد

[مهدی فرزاد]

سلام
من دوباره کد های شما رو برسی کردم

شما اگر دقت کنید وقتی در حالت Edit قرار میگیرید و میرید به سل بعد دیگه جایی کدی ننوشتید که اون سل رو از حالت Edit خارج کنه و باید این کد رو اصلاح کنید
حتی وقتی با موس روی اون سل هایی که رنگشون ثابت مونده میرید کرسر موس روی حالا ویرایش هست یعنی اون سل در حالت Edit باقی مونده

من در خلال کارهام نگاه میکنم اگر وقت شد اصلاحش میکنم

[مهدی فرزاد]

سلام مجدد
با همون استایل قبلی خودتون فقط این کد رو در ادامه کدتون اضافه کنید
اونجا که نوشتید

if (data.Column02 == string.Empty || data.Column02 == null)

{

e.Handled = true;

MessageBox.Show("Not Empty Column 02");

return;

}

بعدش یک else بنویسید به شکل زیر

else

{

CurrentCell = GridHelper.GetCell(MainDataGrid, View.CurrentPosition, 0);

CurrentCell.IsSelected = false;

CurrentCell.IsEditing = false;

CurrentCell.Focus();

 

 

}

تست کردم درست بود

[PetekDincos]

با سلام
در مورد Merge کردن دو تا استایل که هر دو مربوط به یک کنترل هستند مثلا یکی در ResourceDictionary تعریف شده و دیگری در Resource خود فرم برای Merge کردن این دو تا استایل با یکدیگر و اعمال آن به یک کنترل که قبلا در همین تاپیک سوال کرده بودم دیروز به یه مطلبی برخورد کردم که به صورت زیر می شه این کار رو انجام داد
ابتدا در ResourceDictionary استایل خود را با یک نام برای آن مثلا Style1 تعریف کرده و سپس در Resource خود فرم در موقع تعریف استایل دو به صورت زیر عمل می کنیم

<Style x:Key="Style2" BasedOn="{StaticResource Style1}" TargetType="{x:Type ControlType}"> 




</Style>

و به صورت StaticResource استایل Style2 را به کنترل اعمال می کنیم