Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-11977] iOS: ScrollView inside a View with percentage width is scrolling horizontally even if it shouldn't

GitHub Issuen/a
TypeBug
PriorityHigh
StatusClosed
ResolutionFixed
Resolution Date2013-01-02T18:21:46.000+0000
Affected Version/sn/a
Fix Version/sRelease 3.1.0, 2013 Sprint 01 API, 2013 Sprint 01
ComponentsiOS
Labelsmodule_scrollView, qe-testadded
ReporterDavide Cassenti
AssigneeVishal Duggal
Created2012-12-06T11:09:32.000+0000
Updated2014-06-19T12:44:15.000+0000

Description

Problem description

When a View has a width set in percent, and a ScrollView is put inside it, the ScrollView scrolls horizontally even if the content does not exceed the width of the View.

Steps to reproduce

Use the following code to see the issue
// Create a window
var win1 = Ti.UI.createWindow({
	backgroundColor : 'white'
});


var Container = Ti.UI.createView({top: 255,
    width:'95%'});
var ScrollArea = Ti.UI.createScrollView({
        left: 12,
            top: 36,
            width: Ti.UI.FILL,
            height: Ti.UI.SIZE,
            layout: 'vertical',
            backgroundColor: '#00f',
            borderRadius:1, 
            borderColor: '#f00'}
            );
var label = Ti.UI.createLabel({
            text:'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus ultrices, ante ut aliquam tempor, lorem velit semper est, at vehicula eros purus eget sem. Etiam eget sapien ut purus rutrum fringilla. Duis non est sit amet sem tincidunt aliquam. Sed bibendum molestie nisl quis dictum. Cras vitae dui ligula. Phasellus nec lectus nec metus venenatis laoreet. Suspendisse aliquam justo porta massa tempus et auctor eros gravida. Suspendisse at aliquet ipsum. Maecenas tincidunt sagittis feugiat. Sed pellentesque sem at augue tincidunt vel condimentum diam porta. Curabitur tempor egestas odio, at ultrices lacus lacinia in.',
            height: Ti.UI.SIZE,
            color: '#4b4b4b',
            width: '94%',
            wordWrap: true,
            backgroundColor: '#0Ff',
            borderRadius:1, 
            borderColor: '#0f0'});
     ScrollArea.add(label);

     Container.add(ScrollArea);

win1.add(Container);

win1.open();
As you can see, the width of the View is 95%, and if you try to scroll horizontally you can see the text bouncing inside it. If the View width is set to a fixed size - say 400 - this behavior doesn't occur.

Comments

  1. Davide Cassenti 2012-12-18

    Seems to be working fine with 3.0.0 GA
  2. Davide Cassenti 2012-12-18

    Regarding my previous comment: it DOES work on the iPhone, but still not working on iPad. Bug still open.
  3. Vishal Duggal 2013-01-02

    Pull pending https://github.com/appcelerator/titanium_mobile/pull/3651
  4. Vishal Duggal 2013-01-02

    Pull ready. Test on iPAD
  5. Sabil Rahim 2013-01-02

    Code Review & Functional Review
  6. Anshu Mittal 2013-01-17

    Tested with: SDK:3.1.0.v20130114171802 Studio:3.0.1.201212181159 Device: iPad3(v6.0) Scrollview inside a view does not scroll horizontally if it should not.

JSON Source