Telerik RadEditor move cursor while dragging - c#

I have a C# webforms page where I want to drag html elements into a telerik radeditor. This part is working as expected except that when you drag an element onto the editor I want the cursor position in the radeditor to follow the mouse. It is set up similar to this demo on Teleriks web site. Except I am using a listview instead of treeview.
http://demos.telerik.com/aspnet-ajax/editor/examples/treeviewandeditor/defaultcs.aspx
I have tried simulating clicks on the radeditor to move the cursor, but no luck there. Any ideas?
Edit:
I have made a semi-working solution last week. Its far from perfect but I decided to share it in case some one else wants to make it better.
function controlDragging(sender, args) {
var event = args.get_domEvent();
var editor = $find("radEditLayout");
if (isMouseOverEditor(editor, event)) {
var x = event.pageX - event.offsetX;
var y = event.pageY - event.offsetY;
var node = editor.get_document().elementFromPoint(x, y);
if (node) {
setCaret(editor, node, 0);
}
}
}
function setCaret(editor, element, position) {
var selection = editor.getSelection(),
range = selection.getRange(true);
if (range.setStartAfter) {//W3 range
range.setStartAfter(element);
}
else { //IE7/8 textRange
range.moveToElementText(element);
range.moveStart('character', position);
}
range.collapse(true);
selection.selectRange(range);
}
function isMouseOverEditor(editor, event) {
return $telerik.isMouseOverElementEx(editor.get_contentAreaElement(), event);
}
Any more suggestions??

Perhaps you will be able to figure out something with ranges, but I am not sure exactly how as I have not used them. Here are the basics on getting an already selected range http://www.telerik.com/help/aspnet-ajax/editor-getselection-1.html and here is how to get the document object so you can use ranges in it: http://www.telerik.com/help/aspnet-ajax/editor-getting-reference-to-radeditor-documentobject.html. Perhaps this can help you get started but I think it will be a lot of work: How to set caret(cursor) position in contenteditable element (div)? because I am not sure how you can calculate the position at which you want the cursor from the mouse coordinates.

I know this post is old but perhaps others can benefit from it. Here's a snippet that helped me drop at a random position in the RadEditor content area. It does not involve moving the cursor position.
kendoDropTarget({
drop: function(e) {
debugger;
var top = e.draggable.drag.y.location - $('.k-content').offset().top;
var left= e.draggable.drag.x.location - $('.k-content').offset().left;
element.css({
top: top + 'px',
left: left + 'px'
});
$('.overlay').remove();
$('.k-content').contents().find('body').html($('.k-content').contents().find('body').html() + $(element).outerHTML());
}

Related

How can I display an element relative to an other in Unity without "moving effects"?

I'm starting with unity since a few weeks and i'm stuck with some displaying problems.
You can see what I want to achieve here :
On several of my pages I have a title with an icon on the left and I want it to be at 40px on the left of the title, no matter the size of it.
So I did a prefab with an empty Text for the title, an empty RawImage for the icon and I put that prefab on the center top of the screen.
I link the following C# script on my prefab with the 'string' parameter for the title and the 'Texture' parameter for the icon to display.
using System.Linq;
using UnityEngine;
using UnityEngine.UI;
public class TitlePage : MonoBehaviour {
public string title;
public Texture texture;
private Text titlePageText;
private RawImage iconPage;
void Awake()
{
titlePageText = gameObject.GetComponentsInChildren<Text>().First();
iconPage = gameObject.GetComponentsInChildren<RawImage>().First();
}
void Start()
{
titlePageText.text = title;
}
void Update()
{
iconPage.rectTransform.anchoredPosition = new Vector2(-titlePageText.rectTransform.rect.width / 2 - 40, iconPage.rectTransform.anchoredPosition.y);
iconPage.texture = texture;
}
}
The title is set well in the "Start" function, the problem is with the icon. The code in the "Update" function put the icon at the wanted position if it's in the "Update" function because in the "Start", 'titlePageText.rectTransform.rect.width' give 0. But with that code in the "Update" function, the icon start with a display by default in the center and nearly instantly it moves on the left but we can see that position changing.
Maybe there's a solution to avoid that ?
Maybe I started in a wrong way ?
(I don't put my title's text hardly because I want my application to be multilingual so instead of displaying the 'string' in parameter, I'll display the corresponding translation and it's why I can't set a fixed position because two translations are not the same length.)
Thanks in advance !
I am not entirely sure what your problem is exactly, but it does sound like you are trying to solve something from a slightly awkward angle. IS there a reason for not using Unity's layout (or even auto layout groups) to achieve your goal?
I just did a quick test: added 'Content Size Fitter component' to the text object with Horizontal set to Preferred, then placed an image as a child of that text object, when I set the anchor X to 0 and pivot X to 1, the image now follows the left hand side of the text, no matter what size.
This has the advantage of doing absolutely zero work unless text (or its position) changes, in which case everything is handled automagically by Unity's UI system
It sounds like the width of the titlePageText is not obtaining a value immediately in Start(), which is why it is initially zero. After a couple of frames when a non-zero value is found, it finally shifts your iconPage over but your object already has a texture at this point. You really shouldn't be doing this in Update() because it means it will constantly be setting the anchoredPosition and texture of your iconPage every frame.
One solution to avoid this would be to use a coroutine with yield to wait for your components to initialize and then set the position. Note that this is a bit of a hack since you are introducing some forced loading time.
public string title;
public Texture texture;
private Text titlePageText;
private RawImage iconPage;
void Awake()
{
titlePageText = gameObject.GetComponentsInChildren<Text>().First();
iconPage = gameObject.GetComponentsInChildren<RawImage>().First();
}
void Start()
{
titlePageText.text = title;
StartCoroutine(initializeComponenets());
}
IEnumerator initializeComponenets()
{
yield return new waitForSeconds(.05f); //might need longer wait here
iconPage.rectTransform.anchoredPosition = new Vector2(-titlePageText.rectTransform.rect.width / 2 - 40, iconPage.rectTransform.anchoredPosition.y);
iconPage.texture = texture;
}

How to create a smooth animated text marquee?

I know that there are lot of different threads about horizontal text animation/text scrolling, but unfortunately none of them give smooth scrolling with repeatable text. I have tried double/thickness animation using various WPF controls containing text. Also tried animating with visual brush which gives me by far the most elegant scrolling compared to other approaches (for e.g. playing with Canvas.Left property etc.) but that too goes blur the text, if the text length or the animation speed is too high.
I'm over to a pure DirectX C# implementation using SharpDX library. Should also mention that I'm a beginner with DirectX programming. Here is the code:
public void RunMethod()
{
// Make window active and hide mouse cursor.
window.PointerCursor = null;
window.Activate();
var str = "This is an example of a moving TextLayout object with no snapped pixel boundaries.";
// Infinite loop to prevent the application from exiting.
while (true)
{
// Dispatch all pending events in the queue.
window.Dispatcher.ProcessEvents(CoreProcessEventsOption.ProcessAllIfPresent);
// Quit if the users presses Escape key.
if (window.GetAsyncKeyState(VirtualKey.Escape) == CoreVirtualKeyStates.Down)
{
return;
}
// Set the Direct2D drawing target.
d2dContext.Target = d2dTarget;
// Clear the target.
d2dContext.BeginDraw();
d2dContext.Clear(Color.CornflowerBlue);
//float layoutXOffset = 0;
float layoutXOffset = layoutX;
// Create the DirectWrite factory objet.
SharpDX.DirectWrite.Factory fontFactory = new SharpDX.DirectWrite.Factory();
// Create a TextFormat object that will use the Segoe UI font with a size of 24 DIPs.
textFormat = new TextFormat(fontFactory, "Verdana", 100.0f);
textLayout2 = new TextLayout(fontFactory, str, textFormat, 2000.0f, 100.0f);
// Draw moving text without pixel snapping, thus giving a smoother movement.
// d2dContext.FillRectangle(new RectangleF(layoutXOffset, 1000, 1000, 100), backgroundBrush);
d2dContext.DrawTextLayout(new Vector2(layoutXOffset, 0), textLayout2, textBrush, DrawTextOptions.NoSnap);
d2dContext.EndDraw();
//var character = str.Substring(0, 1);
//str = str.Remove(0, 1);
//str += character;
layoutX -= 3.0f;
if (layoutX <= -1000)
{
layoutX = 0;
}
// Present the current buffer to the screen.
swapChain.Present(1, PresentFlags.None);
}
}
Basically it creates an endless loop and subtracts the horizontal offset. Here are the challenges: I need repeatable text similar to HTML marquee without any gaps, Would probably need to extend it to multiple monitors.
Please suggest.
I don't know neither how to use DirectX nor sharpdx, but if you want you can consider this solution
I had a similar problem a while ago, but with the text inside a combobox. After a bounty i got what i was looking for. I'm posting the relevant piece of code as an example, but you can check the complete answer here
Basically, whenever you have a textblock/textbox that contain a string that cannot be displayed completely, cause the length exceed the textblock/box lenght you can use this kind of approach. You can define a custom usercontrol derived from the base you need (e.g. SlidingComboBox : Combobox) and define an animation for you storyboard like the following
_animation = new DoubleAnimation()
{
From = 0,
RepeatBehavior = SlideForever ? RepeatBehavior.Forever : new RepeatBehavior(1), //repeat only if slide-forever is true
AutoReverse = SlideForever
};
In my example i wanted this behaviour to be active only when the mouse was on the combobox, so in my custom OnMouse enter i had this piece of code
if (_parent.ActualWidth < textBlock.ActualWidth)
{
_animation.Duration = TimeSpan.FromMilliseconds(((int)textBlock.Text?.Length * 100));
_animation.To = _parent.ActualWidth - textBlock.ActualWidth;
_storyBoard.Begin(textBlock);
}
Where _parent represent the container of the selected item. After a check on the text lenght vs combobox lenght i start the animation and end it at the end of the text to be displayed
Note that in the question i mentioned there are also other soltions. I'm posting the one that worked for me

Filling a shape of visio with color in c#

Hi i am creating Shapes of visio2013 using c# .Now i need to fill the shape with some colors using c# i tried the below codes but nothing makes sense :( :(
Visio.Cell cqellname;
cqellname = shape.get_CellsSRC(
(short)Visio.VisSectionIndices.visSectionObject,
(short)Visio.VisRowIndices.visRowFill,
(short)Visio.VisCellIndices.visFillBkgnd);
cqellname.FormulaU = "rgb(255,0,0)";
above code throws an error as Cell is Guarded.
shape.get_CellsSRC((short)Visio.VisSectionIndices.visSectionObject,
(short)Visio.VisRowIndices.visRowFill,
(short)Visio.VisCellIndices.visFillBkgnd).FormulaForceU = "RGB(" + R + "," + G + "," + B + ")";
tried the above, it doesn't throw any exceptions but nothing changed in the shape.
i already tried this solution from stackoverflow and its too not working
I can able to see the value assigned by me in shapesheet FillForeGnd and FillBkGnd , but the shape is not filling with the color which i gave .
Can any one please tell me how to do this..??
As I mentioned in the answer above (which you have marked as not useful) you are targeting the wrong shape.
Now that you've editted your question to include more details it's clear which shape you're dealing with.
The shape you're targeting appears to be the "Collapsed Sub-Process" from the "BPMN Basic Shapes" stencil. This is a group shape and the top level has no geometry, so changing its color, as you're doing in your question, has no visual change. To solve this you need to find sub-shape that is used to show the background. It happens that in this specific master, the sub-shape that contains the fill you need to target has an index one greater than the parent, so you can use this in the code. The shape lacks any other clear features (such as a User cell) that would make for a better candidate so please note that this method is just for this particular shape.
Given that you appear to be doing a fair bit of work with this stencil, my approach would be to create a copy of the stencil and make some modifications to the masters to make this kind of interaction a little easier, but I hope in the meantime that the following code answers your question.
Please mark it as answered if that's the case.
public void OnCheckFillBPMN()
{
Color fillColor = Color.FromArgb(1, 255, 0, 0);
CollapsedSubProcessFill(this.Application.ActiveWindow.Selection.PrimaryItem, fillColor);
}
private void CollapsedSubProcessFill(Visio.Shape vShpIn, Color fillColor)
{
if (vShpIn != null && vShpIn.Master != null && vShpIn.Master.NameU.StartsWith("Collapsed Sub-Process"))
{
//The sub-shape that provides the fill colour in
//the 'Collapsed Sub-Process' master is the first index
//after the group shape.
//If you want to use a different method to locate the
//correct sub-shape then do that here.
var targetSubShpId = vShpIn.ID + 1;
var targetShp = TryGetShapeInCollection(vShpIn.Shapes, targetSubShpId);
if (targetShp != null)
{
var targetCell = targetShp.get_CellsSRC(
(short)Visio.VisSectionIndices.visSectionObject,
(short)Visio.VisRowIndices.visRowFill,
(short)Visio.VisCellIndices.visFillForegnd);
targetCell.FormulaU = "RGB(" + fillColor.R
+ ',' + fillColor.G
+ ',' + fillColor.B + ')';
}
}
}
private Visio.Shape TryGetShapeInCollection(Visio.Shapes vShps, int shpId)
{
try
{
if (vShps != null)
{
var targetShp = vShps.ItemFromID[shpId];
return targetShp;
}
}
catch (System.Runtime.InteropServices.COMException ex)
{
if (ex.ErrorCode == -2032465756) //Invalid sheet identifier
{
return null;
}
}
return null;
}
If the FormulaForceU works but you get no visual change then I assume you're not setting the correct cell. Normally you'd set the FillForegnd cell (visFillForegnd) unless there's a different pattern set. Also note that (for Visio 2013+) if FillGradientEnabled is set to true, this will override the solid colors.
One last thing to bear in mind is that the shape you're targeting might have no geometry, or it might have its NoFill cell set to true, and really you should be targeting a child / sub-shape.
In either case you should crack open the ShapeSheet and see what state the shape is in.

Kinect: Grab/Release

I'm a beginner in Kinect Programming. Yet I read different tutorials and texts about it. Furthermore I was working on the code examples ("Controls Basis-WPF").
Unfortunately none of the sources teach me how to code grabbing and releasing in a way that I understand.
I would like to create dynamically KinectTileButtons. While the program is running the user should be able to place the buttons to the positions he prefers. The player uses his hand as the cursor.
For example:
There is a button b1 on the top left corner.
While the hand of the user is not on b1, the button doesn't change his position.
If the user's hand is on the button AND he makes the "GRAB"-gesture, the position of the button is like the position of his hand (variable position). When he RELEASES, the position of button is constant and will not change until the user is grabbing for the button the next time.
I'm very thankful for any advices, suggestions or code examples, because I really don't know how I should continue to work on this problem.
Thanks in advance
derpate
What you should be going for is to change the location of the buttons on the window. I would have some global bools to signify is they are grabbing and holding. Then I would put a conditional in the update to move the label to the position of the hand. Here's some pseudo-code:
bool grabbing = false;
bool selected = false;
var button;
var handElement;
Start()
{
button = window.Button;
handElement = window.handElement;
...
sensor.Start();
}
Update() //all frames ready
{
using (SkeletonFrame sf = e.OpenSkeletonFrame())
{
... //get skeleton and position
... //tell if grabbing
if (/*however you do the grab gesture*/)
grabbing = true;
if (selected && grabbing)
{
button.X = handElement.X;
button.Y = handElement.Y;
}
}
}
Button_OnClick()//or whatever it is called for the Kinect UI control
{
selected = true;
}
Sorry for the pseudo-code, I just haven't worked with the Kinect UI before, and I didn't want to have half pseudo-code with the elements I don't know, however I know that it has events like OnClick() for when it is held, and I don't know what you mean by "GRAB" gesture but I assume you know how to implement it if you know what it is. Good luck!
Know also this only works for one button. If you were doing this for many, I would suggest a class... something like:
class MoveableButton : KinectButton//again, don't know the exact name of this
{
private int X, Y;
private bool selected = false, grabbing = false;
public void Selected()
{
selected = true;
}
public void Grabbed()
{
grabbing = true;
}
public void LetGo()
{
grabbing = false;
selected = false;
}
public void Update(UIElement hand)
{
if (selected && grabbing)
{
this.X = hand.X;
this.Y = hand.Y;
}
}
}
This you would then call the appropriate methods during certain frames, I would have an array of them to loop through for Update.

Determining which CustomPopupPlacement was used for WPF Popup

I'm trying to figure out which of the passed in array of CustomPopupPlacement positions have been used when the popup actually renders. Is there any event to detect this?
This msdn thread from 2009 seems to be exactly my issue however there does not seem to be an answer for it.
http://social.msdn.microsoft.com/Forums/da/wpf/thread/4c6d216a-0011-4202-aa7e-2fccef3cc355
The marked answer seems invalid and my situation is exactly as the OP in the thread.
I'm going to have my popup with 4 paths and use a DP to toggle visibility on three paths to choose the correct arrow path being rendered.
So given we provide 4 placement options via the CustomPopupPlacementCallbackdelegate, Is there a way to detect which of the 4 positions the system finally chose after dealing with screen edge cases and the sorts.
A better way to find placement of the Popup.
This method requires a Child element to be present, but that's no problem considering the Grid that comes with a Popup element.
UIElement container = VisualTreeHelper.GetParent(this) as UIElement;
Point relativeLocation = this.Child.TranslatePoint(new Point(0, 0), container); //It HAS(!!!) to be this.Child
if (relativeLocation.Y < 0) //or use X for left and right
{
Console.WriteLine("TOP PLACEMENT!");
}
else
{
Console.WriteLine("BOTTOM PLACEMENT!");
}
I have a little hacky solution.
Save the custom points as fields in the derived TooTip class and override the OnOpened method.
protected override void OnOpened(RoutedEventArgs e)
{
base.OnOpened(e);
var p = this.TranslatePoint(new Point(0, 0), this.PlacementTarget);
var diff1 = this.first - p;
var diff2 = this.second - p;
if (Math.Abs(Math.Min(diff1.Length, diff2.Length) - diff1.Length) < 0.01)
{
// First Point
}
else
{
// Second Point
}
}
Better solutions are welcome

Categories