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

Java Development

Reply
New Contributor
Posts: 3
Registered: ‎08-19-2011
My Device: 8520
My Carrier: yes

SVG image scrolling issue in Blackberry OS 6

Hi,

 

i created  one SVG image as per my application and it is scrolling in screen  as per my requirements perfectly in BB  OS 5 and below OS versions. And the same SVG image is  scrolling in BB OS 6 but whenever scrolling happens

 the screen fails to draw itself properly upon scrolling. In tha case SVG image looks cluttering(like overlaopping ,blurring).

 

can any one guide me to solve this issue in BB  OS 6?

 

 

Thanks

Madhu

BlackBerry Development Advisor
Posts: 15,752
Registered: ‎07-09-2008
My Device: BlackBerry PRIV
My Carrier: Bell

Re: SVG image scrolling issue in Blackberry OS 6

Can you post some sample code that reproduces this behaviour?

Mark Sohm
BlackBerry Development Advisor

Please refrain from posting new questions in solved threads.
Problem solved? Click the Accept As Solution button.
Found a bug? Report it using Issue Tracker
New Contributor
Posts: 3
Registered: ‎08-19-2011
My Device: 8520
My Carrier: yes

Re: SVG image scrolling issue in Blackberry OS 6

Hi Mark,

below is  the complete code. when i run this code in BB OS 5 simulator and devices it  is scrolling fine. But the same code when  run in BB OS 6 simulator and device it  gives problem while scrolling. SVG image is getting clusterd on  the top. i've attached screen shots for your reference.

Your help and suggestion will be highly appreciated.

 

/*
 * SVGScreen.java
 */

import java.io.IOException;
import java.io.InputStream;

import javax.microedition.m2g.SVGAnimator;
import javax.microedition.m2g.SVGImage;

import net.rim.device.api.ui.Field;
import net.rim.device.api.ui.FieldChangeListener;
import net.rim.device.api.ui.Manager;
import net.rim.device.api.ui.UiApplication;
import net.rim.device.api.ui.component.ButtonField;
import net.rim.device.api.ui.component.ChoiceField;
import net.rim.device.api.ui.component.Dialog;
import net.rim.device.api.ui.component.ObjectChoiceField;
import net.rim.device.api.ui.container.FlowFieldManager;
import net.rim.device.api.ui.container.MainScreen;
import net.rim.device.api.ui.container.VerticalFieldManager;

import org.w3c.dom.Document;
import org.w3c.dom.svg.SVGElement;

/**
 * Simple demo showing how to create an interactive
 * svg file which contains animation and acquire its
 * hosted ui field to add it to the screen.
 */
public final class SVGScreen extends MainScreen
{
    // String constants.
    private static final String BOUNCING_BALL = "bouncingBall";
    private static final String PLANETS = "planets";
    private static final String RUNNER = "runner";
    private static final String DISPLAY_ATTR = "display";
    private static final String NONE_VALUE = "none";
    private static final String INLINE_VALUE = "inline";
    
    // The svg files we want to demo.
    private static final String SAMPLE_URL = "/sample.svg";
    private static final String FIELD_PACKAGE = "net.rim.device.api.ui.Field";
    
    private SVGImage _image;
    
    private SVGAnimator _animator;
    
    // Holds the element id of the element that is currently being displayed.    
    private String _currentAnimation;
    
    // The interactive ui field holding the animated svg context.    
    private Field _field;
   
    // Components used to start the selected animation.
    private ObjectChoiceField _options;
    private ButtonField _playButton;    
    
    /**
     * Constructor.
     */
    public SVGScreen()
    {        
        setTitle("SVG Animator Demo");
        
        // Set up the components that allow the user to choose
        // an animation and then run it.
        VerticalFieldManager vManager = new VerticalFieldManager(Manager.VERTICAL_SCROLL);
        Manager fManager = new FlowFieldManager(Manager.VERTICAL_SCROLL);
        setChoiceField();
        fManager.add(_options);
        setButtonField();
        fManager.add(_playButton);
         
        vManager.add(fManager);       
        add(vManager);  
        
        // First animation is set to the bouncing ball animation by default.
        _currentAnimation = BOUNCING_BALL;
        try
        {
            // Load our svg image.
            _image = loadSVGImage(SAMPLE_URL);
            // Create an interactive svg animator which hosts our ui field.
            _animator = SVGAnimator.createAnimator(_image, FIELD_PACKAGE);
            // Get the ui field from the animator.
            _field = (net.rim.device.api.ui.Field)_animator.getTargetComponent();            
            // Add the field to the screen.
            vManager.add(_field);  
            _animator.play();
            _playButton.setFocus();
            
        }
        catch (final IOException e)
        {
            UiApplication.getUiApplication().invokeLater(new Runnable()
            {
                public void run()
                {
                    Dialog.alert("SVGScreen#loadSVGImage() threw " + e.toString());
                }
            });
        }                 
    }    
    
    /**
     * Lays out the ChoiceField with a list of available animations.
     */
    private void setChoiceField()
    {
        String[] items = {"Bouncing Ball", "Running Stick", "Planets"};
        _options = new ObjectChoiceField("Samples:", items);
        
        _options.setChangeListener(new FieldChangeListener()
        {
            public void fieldChanged(Field field, int context)
            {
                if ( (context & ChoiceField.CONTEXT_CHANGE_OPTION) != 0 )
                {
                    String elementId = null;
                    int index = _options.getSelectedIndex();
                    switch (index)
                    {
                        case 0:
                            elementId = BOUNCING_BALL;
                            break;
                        case 1:
                            elementId = RUNNER;
                            break;
                        case 2:
                            elementId = PLANETS;
                            break;                 
                    }
                    
                    setDisplayInline(elementId);
                    _playButton.setFocus();
                }
            }
        });
    }    
    
    /**
     * Activates the given element.
     * @param elementId the id of the element being activated
     */
    private void activateElement(String elementId)
    {
        Document doc = (Document) _image.getDocument();
        SVGElement element = (SVGElement) doc.getElementById(elementId);
        _image.focusOn(element);
        _image.activate();
    }    
    
    /**
     * Displays the given element.
     * @param elementId the id of the element being displayed
     */
    private void setDisplayInline(String elementId)
    {
        Document doc = (Document) _image.getDocument();
        SVGElement animation = null;
        if (!_currentAnimation.equals(""))
        {
            animation = (SVGElement) doc.getElementById(_currentAnimation);
            animation.setTrait(DISPLAY_ATTR, NONE_VALUE);
        }
        
        animation = (SVGElement) doc.getElementById(elementId);
        _currentAnimation = elementId;
        animation.setTrait(DISPLAY_ATTR, INLINE_VALUE);
    }        
        
    /**
     * Lays out the button that starts the current animation.
     */
    private void setButtonField()
    {
        _playButton = new ButtonField("Play", ButtonField.CONSUME_CLICK);
        _playButton.setChangeListener(new FieldChangeListener()
        {
            public void fieldChanged(Field field, int context)
            {
                activateElement(_currentAnimation);
            }
        });
    }   
    
    /**
     * Loads an SVGImage from a given URL.
     * @param url The path to the svg image we want to load.
     * @return The loaded svg image.
     */
    private SVGImage loadSVGImage(String url) throws IOException
    {
        // Open our input stream of the svg file we want to load.
        InputStream inputStream = getClass().getResourceAsStream(url);    
        
        // Load our svg image from the input stream.
        return (SVGImage)SVGImage.createImage(inputStream, null);
    }
    
    /**
     * Prevent the save dialog from being displayed.
     *
     * @see net.rim.device.api.ui.container.MainScreen#onSavePrompt()
    */
    public boolean onSavePrompt()
    {
        return true;
    }   

}

  
image 1image 2

 

the two images are the screenshots of the application. first one is before scrolling and the second one is after scrolling the screen of the device.

BlackBerry Development Advisor
Posts: 15,752
Registered: ‎07-09-2008
My Device: BlackBerry PRIV
My Carrier: Bell

Re: SVG image scrolling issue in Blackberry OS 6

I'm not able to see the screenshots.  What does "sample.svg" contain?

Mark Sohm
BlackBerry Development Advisor

Please refrain from posting new questions in solved threads.
Problem solved? Click the Accept As Solution button.
Found a bug? Report it using Issue Tracker