Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Web and WebWorks Development


Thank you for visiting the BlackBerry Support Community Forums.

BlackBerry will be closing the BlackBerry Support Community Forums Device Forums on April 1st (Developers, see below)

BlackBerry remains committed to providing excellent customer support to our customers. We are delighted to direct you to the CrackBerry Forums, a well-established and thorough support channel, for continued BlackBerry support. Please visit http://forums.crackberry.com or http://crackberry.com/ask. You can also continue to visit BlackBerry Support or the BlackBerry Knowledge Base for official support options available for your BlackBerry Smartphone.

"When we launched CrackBerry.com 10 years ago, we set out to make it a fun and useful destination where BlackBerry Smartphone owners could share their excitement and learn to unleash the full potential of their BlackBerry. A decade later, the CrackBerry community is as active and passionate as ever and I know our knowledgeable members and volunteers will be excited to welcome and assist more BlackBerry owners with their questions."

- Kevin Michaluk, Founder, CrackBerry.com

Developers, for more information about the BlackBerry Developer Community please review Join the Conversation on the BlackBerry Developer Community Forums found on Inside BlackBerry.


Reply
Developer
Posts: 322
Registered: ‎08-06-2012
My Device: Dev Alpha / Playbook / Curve 9300
Accepted Solution

Image editing on playbook

Was wondering how to save an image after being edited.

 

I have coded an app that takes a photo then displays it for editing purposes.  The user has various controls that can be used to apply different effects.  Problem is this:  The image is smaller as it is on screen surrounded by controls.  I'm using a canvas element which I then can use to save.

 

How would I apply the effects to the image in its original size?  I thought of maybe creating a new screen (I'm using bbui) and passing parameters to it to apply the effects, then force saving it...  Is there another approach?

If it helped you, click like. Smiley Happy
BlackBerry Development Advisor
Posts: 769
Registered: ‎10-01-2009
My Device: All
My Carrier: N/A

Re: Image editing on playbook

[ Edited ]
You can grab your canvas pixel data as a base64 string, then pass that string to the html5 file API to save it. I'm hoping to have a full example of this posted in the somewhat near future. To get b64 from your canvas, you'd use this command, after you do the canvas ctx.drawImage...
var b64 = canvas.toDataURL("image/jpeg", 1);
Developer
Posts: 322
Registered: ‎08-06-2012
My Device: Dev Alpha / Playbook / Curve 9300

Re: Image editing on playbook

Tx for the reply BUT, will that save the image at its original size if I am editing it in a canvas element half the screen size OR will it save the image at the half size that its currently at on screen.

 

Will try your code later today, need to finish coding some effects first.  Just wondering if this has been done before.

If it helped you, click like. Smiley Happy
BlackBerry Development Advisor
Posts: 769
Registered: ‎10-01-2009
My Device: All
My Carrier: N/A

Re: Image editing on playbook

I believe when you do your drawImage() you specify the width/height.  It'll be based upon that.

Highlighted
Developer
Posts: 322
Registered: ‎08-06-2012
My Device: Dev Alpha / Playbook / Curve 9300

Re: Image editing on playbook

Any chance someone has some code for this?

 

I am using camanjs (http://www.camanjs.com) to do some effects on the image before saving and was wondering how this would work.

 

The code they supply is:

 

Caman('img/example.jpg', '#image-caman', function () {
  this.saturation(-20);
  this.brightness(10);
  
  this.render(function () {
    this.save('png'); 

/* shows a download file prompt. Tried this didn't get a prompt but the web inspector on the device EVENTUALLY dumps some data of image type but no prompt... :( */ // or... this.toBase64();

/* base64 data URL representation of the image. useful if you want to upload the modified image. Tried this it didn't work! */
}); });

 

 

If it helped you, click like. Smiley Happy
Developer
Posts: 322
Registered: ‎08-06-2012
My Device: Dev Alpha / Playbook / Curve 9300

Re: Image editing on playbook

Web inspector sample:

 

Resource interpreted as Document but transferred with MIME type image/octet-stream: "data:image/octet-stream;base64,iVBORw0KGgoAAAANSUhEUgAAAt4AAAHqCAYAAAAzl0l5AAAgAElEQVR4XqS9WYyk2XXndyMyIzMj97X2vbq6m93NJptLc9VQNKnNkmyJ0kij0QgcAbIAGTAMjB9sYwZ+8gAGDBh+8ovtJwOGARuaGWBs2RpIooakuFNcutl77UtW7mtk5Br+/c79bvbXySJHI0UhKiK/+Ja7nHvO/6y38d//F/9Rb3p6Km1tb6Tl5aW0uLycJo76U2NpJTUHW2lydCKtbe+kU6fm0traWuo1+lKz2Up7h720t7eTet291Gy1U3ucvzcO0uhgX+pr7KaJiYnU29hMKR2m/jSUxsaHUuPgIO3u96fe/m4aHh1ID1aW0/BAKw0OTaat/ZS+/sMfpStXL6dTw2NpujWa1ja7PHs3fb+5ktYbzTTaGE4HA31pc3cnPTPRThcHBlPv8CA1Bxqpv9VK2wfj6fWHC2m7...

If it helped you, click like. Smiley Happy
Developer
Posts: 322
Registered: ‎08-06-2012
My Device: Dev Alpha / Playbook / Curve 9300

Re: Image editing on playbook

Solved it using this thread.  You need to edit a webworks AIR file in order to accomplish it.

http://supportforums.blackberry.com/t5/Web-and-WebWorks-Development/stringToblog-save-image-problem/...

 

Tx to  for pointing me to this thread.

If it helped you, click like. Smiley Happy