This is a migrated thread and some comments may be shown as answers.

Drag Drop with Metro Theme

6 Answers 104 Views
ListBox
This is a migrated thread and some comments may be shown as answers.
Stanescu Mihai
Top achievements
Rank 1
Stanescu Mihai asked on 22 Nov 2012, 01:14 PM
Hello Telerik,

I am currently using SL5 with telerik version 2012.1.326.1050
I have an issue when applying the metro theme to a RadListBox which has drag and drop enabled. 
If i don't apply the theme, drag and drop works fine with the below code, as soon as I apply the theme it stops working, I have also tried different DragDropManager.AllowCapturedDrag/DragDropManager.AllowDrag combination.


<telerik:RadListBox ItemsSource="{Binding PlayingCopies}" VerticalAlignment="Stretch"
        BorderBrush="{x:Null}" BorderThickness="0" SelectionMode="Extended"
        telerik:StyleManager.Theme="Metro"
        ScrollViewer.VerticalScrollBarVisibility="Auto"
        ScrollViewer.HorizontalScrollBarVisibility="Disabled"
        ItemContainerStyle="{StaticResource RadListBoxItemStyle}"
        ItemTemplate="{StaticResource RadListBoxItemTemplate}" >
    <telerik:RadListBox.DataConverter>
       <common:DataConverterAppointments />
    </telerik:RadListBox.DataConverter>
    <telerik:RadListBox.DragDropBehavior>
       <drag:ListBoxDragDropBehavior AllowReorder="False" />
    </telerik:RadListBox.DragDropBehavior>
    <telerik:RadListBox.DragVisualProvider>
        <drag:ScreenshotDragVisualProvider />
    </telerik:RadListBox.DragVisualProvider>
 
    <i:Interaction.Triggers>
       <i:EventTrigger EventName="SelectionChanged">
           <gala:EventToCommand Command="{Binding DataSource.SelectionChangedCommand, Source={StaticResource DataContextProxy}}" PassEventArgsToCommand="True"/>
       </i:EventTrigger>
     </i:Interaction.Triggers>
</telerik:RadListBox>


<Style x:Key="RadListBoxItemStyle" TargetType="telerik:RadListBoxItem" >
   <Setter Property="HorizontalContentAlignment" Value="Stretch" />
   <Setter Property="telerik:DragDropManager.AllowCapturedDrag" Value="True" />
   <Setter Property="telerik:DragDropManager.AllowDrag" Value="True" />
</Style>

Any suggestions?

Best regards,
Mihai.

6 Answers, 1 is accepted

Sort by
0
Georgi
Telerik team
answered on 27 Nov 2012, 12:22 PM
Hello Mihai,

What you can do about it is to use other ways of setting the theme. I can recommend using our new theming mechanism with implicit styles as shown in this help article. Also you can apply the theme as an application theme :
public MainPage()
       {
           InitializeComponent();
           StyleManager.ApplicationTheme = new MetroTheme();
       }

Hope this will help.

Kind regards,
Georgi
the Telerik team

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

0
Patrick
Top achievements
Rank 1
answered on 26 Jun 2013, 08:42 PM
We are having the same issues with themes. We are currently using an Application Theme but we would like to style our RadListBox differently using a Theme. When doing so the RadListBox drag drop is broken. The link you provided has a note:
You should not set Application Theme using the StyleManager when using implicit styles.

What is the way we can continue to use our Application Theme and differently style the RadListBox using a Theme while maintaining the drag drop functionality?

Thanks,
Patrick

ps we are using SL5 with telerik DLL version 2013.1.225.1050
0
Georgi
Telerik team
answered on 01 Jul 2013, 01:50 PM
Hello Patrick,

Using Implicit Styles and StyleManager are two different approaches of setting theme. When a theme needs to be modified, or style to be applied to all elements of one type we recommend using the Implicit Styles where you can directly edit the current style of the ListBox.
If you want to use StyleManager we will need more information about your scenario as I am not sure what you mean by: " ...and differently style the RadListBox using a Theme".
I think it would be best if you can open a support ticket and attach a simple project showing your scenario and the difficulties you are facing, so we would be able suggest the best approach.

Regards,
Georgi
Telerik
TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for SILVERLIGHT.
Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
Sign up for Free application insights >>
0
Patrick
Top achievements
Rank 1
answered on 01 Jul 2013, 03:26 PM
Georgi,

What I meant by " ...and differently style the RadListBox using a Theme" was that we would like to style the RadListBox using a theme other than the one set by the Application Theme which it is inheriting from. Styling the RadListBox using telerik:StyleManager.Theme="Office_Black" will cause the RadListBox to style and it looks different but it simply breaks the DragDrop functionality as noted by the OP.

Ideally we could set an Application theme and style with a different theme individual components using StyleManager.Theme and not have the DragDrop functionality break. Why does setting the theme using the StyleManager cause DropDrop to fail on the RadListBox, is that by design?

-Patrick

0
Georgi
Telerik team
answered on 04 Jul 2013, 07:43 AM
Hello Patrick,

Thanks for the clarifications.
What basically happens is in order to turn the DragAndDrop feature on, style like that is used:

<Style TargetType="telerik:RadListBoxItem">
      <Setter Property="telerik:DragDropManager.AllowCapturedDrag" Value="True" />
</Style>

So when setting theme with telerik:StyleManager.Theme="Office_Black" this style gets overwritten and the drag and drop feature stops working.

So we recommend using implicit styles as it can prevent similar issues in the future.
Nevertheless if you want to use ApplicationTheme and Theme there is a workaround that could help you in this scenario. The workaround is not to use style for setting the drag and drop, but to set is as a local value for the ListBox. This can be achieved by creating custom ListBox and overriding the PrepareContainerForItemOverride method :

public class CustomListBox :RadListBox
    {
        protected override void PrepareContainerForItemOverride(DependencyObject element, object item)
        {
            base.PrepareContainerForItemOverride(element, item);
            DragDropManager.SetAllowCapturedDrag(element, true);
        }
    }

Hope this would help.

Regards,
Georgi
Telerik
TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for SILVERLIGHT.
Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
Sign up for Free application insights >>
0
Patrick
Top achievements
Rank 1
answered on 08 Jul 2013, 02:53 PM
Georgi,

I understand, that makes sense. I haven't yet tried this method but I imagine it would work nicely for our situation.
Marked as answered for us!

Thanks,
Patrick
Tags
ListBox
Asked by
Stanescu Mihai
Top achievements
Rank 1
Answers by
Georgi
Telerik team
Patrick
Top achievements
Rank 1
Share this question
or