Gary Glass
Top achievements
Rank 1
Gary Glass
asked on 30 Aug 2011, 07:48 AM
Hello,
I'm trying to set the crop width and height to 100 on start, and I don't want people change the crop box size.
How to make the with/height static and unchangeable?
I use the latest version 2011.2.712.40
I'm trying to set the crop width and height to 100 on start, and I don't want people change the crop box size.
How to make the with/height static and unchangeable?
I use the latest version 2011.2.712.40
Thanks
5 Answers, 1 is accepted
0
Hello Gary,
You can use the following example to achieve the required customization to the Crop dialog:
Please let us know if this helps.
All the best,
Dobromir
the Telerik team
You can use the following example to achieve the required customization to the Crop dialog:
<%@ Register Assembly=
"Telerik.Web.UI"
Namespace=
"Telerik.Web.UI"
TagPrefix=
"telerik"
%>
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
>
<html xmlns=
"http://www.w3.org/1999/xhtml"
>
<head id=
"Head1"
runat=
"server"
>
<style type=
"text/css"
>
.resizerHandle, .rieDraggableResizeHandle
{
display: none !important;
}
</style>
</head>
<body>
<form id=
"form1"
runat=
"server"
>
<asp:scriptmanager id=
"ScriptManager"
runat=
"server"
/>
<telerik:RadImageEditor ID=
"theImageEditor"
runat=
"server"
ImageUrl=
"~/images/Vucko.jpg"
OnClientCommandExecuted=
"modifyCommand"
>
</telerik:RadImageEditor>
<script type=
"text/javascript"
>
function
modifyCommand(imageEditor, args) {
if
(args.get_commandName()) {
waitForCommand(imageEditor, args.get_commandName(),
function
(widget) {
widget._constraintBtn.set_checked(
false
);
//stop the aspect ration constraint
widget.set_width(100);
widget.set_height(100);
widget._widthTxt.disabled =
true
;
widget._heightTxt.disabled =
true
;
widget._updateCropBoxFromControls();
});
}
}
function
waitForCommand(imageEditor, commandName, callback) {
var
timer = setInterval(
function
() {
var
widget = imageEditor.get_currentToolWidget();
if
(widget && widget.get_name() == commandName) {
clearInterval(timer);
callback(widget);
}
}, 100);
}
</script>
</form>
</body>
</html>
Please let us know if this helps.
All the best,
Dobromir
the Telerik team
Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>
0
DTC
Top achievements
Rank 1
answered on 28 Dec 2011, 07:24 PM
Hello,
We try the solution and we manage to fix the initial size of the crop zone. We also hide the dialog box.
However, we need to prevent users from resizing the crop selection zone ; and I don't know how to do it.
Could you please give us the property or function to set?
Regards,
D.
We try the solution and we manage to fix the initial size of the crop zone. We also hide the dialog box.
function modifyCommand(imageEditor, args) {
if (args.get_commandName()) {
//lors d'un zoomIn/zoomOut
if (args.get_commandName() == "ZoomIn" || args.get_commandName() == "ZoomOut") {
//garder les mêmes dimensions du cadre
$(".rieDraggableResizeBox").css("width", CROP_WIDTH);
$(".rieDraggableResizeBox").css("height", CROP_HEIGHT);
if (args.get_commandName() == "ZoomOut") {
var $image = $('#RadImageEditor1_EditableImage');
var imgHeight = parseInt($image.css('height'));
var imgWidth = parseInt($image.css('width'));
//la taille du cadre ne doit pas dépasser celle de l'image
if ((imgHeight) <= CROP_HEIGHT || (imgWidth) <= CROP_WIDTH) {
$image.css({ "height": imgHeight * 2, "width": imgWidth * 2 });
}
}
}
waitForCommand(imageEditor, args.get_commandName(), function (widget) {
widget._constraintBtn.set_checked(false); //stop the aspect ration constraint
widget.set_width(CROP_WIDTH);
widget.set_height(CROP_HEIGHT);
widget._widthTxt.disabled = true;
widget._heightTxt.disabled = true;
widget._updateCropBoxFromControls();
});
}
}
function waitForCommand(imageEditor, commandName, callback) {
var timer = setInterval(function () {
var widget = imageEditor.get_currentToolWidget();
if (widget && widget.get_name() == commandName) {
clearInterval(timer);
callback(widget);
}
}, 100);
}
function OnClientLoad(sender, eventArgs) {
//executer la commende Crop
var imageEditor = $telerik.toImageEditor(sender);
imageEditor.fire("Crop", eventArgs);
//cacher le dialog box
$('#RadImageEditor1_ToolsPanel').hide();
$('.rieNoStatusBar .rieStatusBar').css('height', '0');
}
However, we need to prevent users from resizing the crop selection zone ; and I don't know how to do it.
Could you please give us the property or function to set?
Regards,
D.
0
Hi,
A day ago, we provided C# and VB.NET projects which include the external dialog files for RadImageManager and their complete source code. You can download the preferred project from here: Registering External Dialogs of RadImageEditor and customize the desired external dialogs.
Best regards,
Rumen
the Telerik team
A day ago, we provided C# and VB.NET projects which include the external dialog files for RadImageManager and their complete source code. You can download the preferred project from here: Registering External Dialogs of RadImageEditor and customize the desired external dialogs.
Best regards,
Rumen
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
0
Mohammed
Top achievements
Rank 2
answered on 17 Jun 2013, 01:42 AM
Hi guys,
I use the updated version from rad conteols,
How can i achieve the same points please,
Shoukd i use the old code or there is something updated,
Regards,
Mohammee
I use the updated version from rad conteols,
How can i achieve the same points please,
Shoukd i use the old code or there is something updated,
Regards,
Mohammee
0
Hello Mohammed,
The above solutions should work with the latest version of RadControls, however, the newer versions of ImageEditor offer OnClientDialogLoaded event that can be used to apply this modification.
Regards,
Dobromir
Telerik
The above solutions should work with the latest version of RadControls, however, the newer versions of ImageEditor offer OnClientDialogLoaded event that can be used to apply this modification.
Regards,
Dobromir
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.