We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.

Radial Menu Example

Thread ID:

Created:

Updated:

Platform:

Replies:

115205 Jan 3,2014 09:37 AM Mar 2,2018 01:20 AM WinRT 16
loading
Tags: General
Andrew Ridout
Asked On January 3, 2014 09:37 AM

Hi,

I am attempting to use a radial menu in a Windows Store application.  Please see attached screenshot which shows the page I want to add the radial menu to. The page content is held in a GridView containing a collection of 'tiles'.

I have the following requirements:

1) When an GridView item is clicked (i.e. the GridView SelectionChanged event is fired), the radial menu should display at the current mouse position/tap location (or a small offset of the current mouse position), similar to a traditional right-click context menu.

2) The radial menu needs to be invisible until one of the GridView tiles is clicked.  On SelectionChanged, the radial menu needs to fully display (i.e. Visibility="Visible" and IsOpen="True").

I've looked at the samples in the Syncfusion sample application and have also read the online Syncfusion radial menu documentation but I cannot find any useful examples of how to achieve my requirements.

Would it possible for you to provide a sample which meets these requirements?

Regards,
Andrew


Screenshot_82cb8d4b.zip

Vignesh V [Syncfusion]
Replied On January 6, 2014 06:02 AM

Hi  Andrew,

We have prepared a sample that could possibly meet your requirements 'Moving Radial menu to TileItem click and Making it invisible until selectionChanged'. In the sample we have taken pointerPositions and transformed the SfRadialmenu to Pointer's point.

Please find the sample in below link,

Please let us know if you have any queries.

Regards,
Vignesh V

Andrew Ridout
Replied On January 6, 2014 10:59 AM

Thanks for this, the example is very useful.

We're writing the app using the MVVM pattern (PRISM framework).  Would it be possible to provide another example which demonstrates how the radial menu works using MVVM?

Also, I have a further requirement:

1) When the radial menu is open, if the user clicks elsewhere on the page (but not another tile), the menu should close (i.e. Visibility=Collapsed).

Could you include this requirement in the example?

Many thanks for your support.

Regards,
Andrew

Vignesh V [Syncfusion]
Replied On January 7, 2014 05:35 AM

Hi Andrew,

Query1: SfRadial Menu in MVVM pattern.

We have prepared a sample to address your requirement 'SfRadialMenu in MVVM pattern'. Please find the sample in below link,

Query2: To collapse RadialMenu while Clicking outside GridView 

We have Prepared a sample to address your requirement 'To collapse RadialMenu while Clicking apart from GridViewItems'. In the sample we have collapsed SfRadialMenu while GridView losing focus.

Please find the sample in below link,

Please let us know if you have any queries.

Regards,
Vignesh V

Andrew Ridout
Replied On January 13, 2014 09:47 AM

Hi Vignesh,

Thanks for the above examples, they have been useful.

I have been attempting to implement the radial menu within my Prism MVVM app but it is not 100% working.  The problem is that the first time the GridView SelectionChanged event is fired, the radial menu does not fully open nor locate in the correct place.  However, subsequent SelectionChanged events renders the radial menu correctly, i.e. in the correct position and fully open.  Note that I want the radial menu to display at the exact mouse location so I have added this code to the GridView_PointerMoved method:

_viewModel.PointerPositionX = ptrPt.Position.X - (radialMenu.ActualWidth / 2);
_viewModel.PointerPositionY = ptrPt.Position.Y - (radialMenu.ActualHeight / 2);

I have uploaded a zip file which contains two solutions, RadialMenuTest and RadialMenuPrismTest.  RadialMenuTest contains the radial menu functioning correctly but in a non-MVVM app.  RadialMenuPrismTest is a Prism MVVM app where the radial menu does not work 100% correctly, as described above.

Please could you take a look and let me know what the problem is? Logically, the code seems identical.

Let me know if you have any questions or need any further information.

Thanks in advance,
Andrew


RadialMenuTests_98ba7562.zip

Suresh B [Syncfusion]
Replied On January 16, 2014 04:48 AM

Hi  Andrew,

We have modified the given sample that could possibly meet your requirements 'radial menu does not fully open nor locate in the correct place'. In the sample we have modified in the lost focus event,  instead of changing visibility property ,viewmodel property has changed.


Please let us know if you have any queries.

Regards,
Suresh B

Andrew Ridout
Replied On January 21, 2014 04:30 AM

Hi,

Unfortunately, the most recent code you provided does not meet my needs. It seems to function exactly the same as the code example I provided for you.

The problem is that on the first click of a GridView tile (i.e., the first time the radial menu should be displayed):

1) The menu does not display centrally on the mouse position. Rather, it displays offset to the bottom right of the mouse click. Subsequent clicks on other GridView tiles does locate the menu in the correct position.

2) The menu does not fully open on the initial mouse click. Subsequent clicks on other tiles does fully open the menu.

I'd be grateful if you could take another look at the latest code sample I provided, to ensure you understand exactly what my issues are. Hopefully you will be able to find a solution as this is currently hindering the further development of my app.

Thanks and regards,
Andrew



Suresh B [Syncfusion]
Replied On January 24, 2014 03:48 AM

Hi Andrew,

 We are able to reproduce the reported issue 'SfRadialMenu does not display centrally on the mouse position for prism sample' and we have logged a bug report. The fix for this issue will be available in our upcoming Release which is scheduled to be released by 27th March 2014. Please visit our website periodically for update regarding releases.

 Please let us know if you have any queries.

 Regards,

Suresh B


Andrew Ridout
Replied On March 10, 2014 05:56 AM

Hi Suresh,

Can you please let me know if this issue was resolved in your latest WinRT service pack - 11.4.0.30, released 4th March 2014?

Thanks,
Andrew

Vignesh V [Syncfusion]
Replied On March 14, 2014 09:13 AM

Hi Andrew,

 

Sorry about the delayed response.

 

We would like to inform you that this issue fix is not included in our 2013 volume 4 Service pack release 2. This has been fixed and it will be available in our upcoming 2014 volume 1 release. If you need patch for it, then  we request you to contact us at Syncfusion Support or you may also create your customer account under Direct Trac and open a new incident so that our support engineer will assist you accordingly.

Our Direct Trac support system can be accessed from the following link:

 

https://www.syncfusion.com/account/login?ReturnUrl=%2fsupport%2fdirecttrac%2fincidents

 

Regards,

Vignesh V


Andrew Ridout
Replied On March 14, 2014 09:19 AM

Hi Vignesh,

Thanks for the reply.  Do you know when the 2014 volume 1 release will be available?  If it is too far in the future I will raise a support call to request a patch but otherwise, if it is within the next few weeks I am able to wait.

Thanks,
Andrew

Vignesh V [Syncfusion]
Replied On March 17, 2014 09:59 AM

Hi Andrew,

Our major release Vol 1, 2014 is expected to be rolled out by end of this month (Mar 2014). Please visit our website periodically for updates regarding releases.

 

Please let us know if you have any queries.

 

Regards,

Vignesh V


Andrew Ridout
Replied On May 13, 2014 10:01 AM

Hi Vignesh,

I've installed the latest version (v12.1.0.46) and unfortunately this issue has still not been completely resolved.  While the radial menu is fully opening on the first time the GridView_SelectionChanged event is fired, it is not displaying in the correct place.

I have this code in place to locate the menu on the exact location of the mouse pointer:

    _viewModel.PointerPositionX = ptrPt.Position.X - (radialMenu.ActualWidth / 2);
  _viewModel.PointerPositionY = ptrPt.Position.Y - (radialMenu.ActualHeight / 2);
However, the first time the menu opens, it locates to the bottom right of the mouse pointer. Every subsequent time the menu opens, it locates in the correct position, i.e. centred on the mouse click.

Grateful if you could look into this.

Regards,
Andrew

Andrew Ridout
Replied On May 13, 2014 10:16 AM

Hi,

Ignore my previous post, I have now fixed this issue myself by using radialMenu.Width and radialMenu.Height rather than using ActualWidth and ActualHeight.

Thanks for all your help,
Andrew

Vignesh V [Syncfusion]
Replied On May 14, 2014 12:06 PM

Hi Andrew,

Thanks for your update.      
We are glad to know that you have found the solution.Please let us know if you need further assistance.

Regards,
Vignesh V

Ranjith
Replied On February 23, 2018 09:45 AM

Thanks a lot

Durga Rajan [Syncfusion]
Replied On March 2, 2018 01:20 AM

Hi Andrew,

Thanks for the update. Please let us know whether you need any further assistance.

Regards,
Durga S.

CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;