Issue with Titanium: Unable to scroll within tableview

The tableview is not scrolling as expected.

I tested it on a mobile device and the scrolling worked fine, but it doesn't seem to work on tablets.

Please assist.

CODE

var win = Titanium.UI.createWindow({
    title : 'Medall app',
    backgroundColor : '#fff',
    fullscreen : false,
    navBarHidden : true,
    layout : 'vertical',
});
var scrollView = Titanium.UI.createScrollView({
    contentWidth : 'auto',
    contentHeight : 'auto',
    width : Titanium.UI.FILL,
    height : Titanium.UI.FILL,
    top : '0dp',
    bottom : '0dp',
    layout : 'vertical',
    showVerticalScrollIndicator : true
});
win.add(scrollView);
var mainview = Titanium.UI.createView({
    width : Ti.UI.FILL,
    height : Ti.UI.FILL,
    //layout : 'horizontal',
    horizontalWrap : false,
    //right : '10dp',
    //left : '10dp',
    layout : 'vertical',
    //backgroundImage : '/images/backblue.png'
    //backgroundColor : medblue,
    backgroundColor : 'white',
    bottom : '20dp'
    //top : '20dp',
    //backgroundColor:''
});
scrollView.add(mainview);
var tableview = Titanium.UI.createTableView({
    //data : data,
    backgroundColor : 'white',
    width : '90%',
    height : 0,
    layout : 'horizontal',
    padding : '10dp',
    separatorColor : bordercolor_views_textfields,
    top : '0dp',
    borderColor : medblue,
    scrollable : true
});
mainview.add(tableview);
            var a=['1','2','3','4','5'];
            for (var i = 0; i < a.length; i++) {
                   var row = Ti.UI.createTableViewRow({
                    height : '30dp',
                    layout : 'vertical',
                    className : 'row',
                    objName : 'row',
                    onClick : "delete",
                    onPress : "rowvalue",
                    backgroundColor : 'white',
                    //rightImage : '/images/Right_Arrow',
                    top : '0dp',
                    padding : '10dp',
                    width : '100%',
                    horizontalWrap : false,
                    layout : 'horizontal',
                    backgroundColor : 'white',
                    top : '10dp',
                    padding : '10dp',
                });

                var heading_report = Titanium.UI.createView({
                    width : '48%',
                    height : Ti.UI.SIZE,
                    //layout : 'horizontal',
                    horizontalWrap : false,
                    //right : '10dp',
                    //left : '10dp',
                    layout : 'vertical',
                    //backgroundImage : '/images/backblue.png'
                    backgroundColor : 'white',
                    left : '0dp',
                    left : '1%',
                    right : '1%',
                    padding : '10dp',
                });
                row.add(heading_report);

                var heading_report_label = Ti.UI.createLabel({
                    text : a[i],
                    font : {
                        fontSize : '20dp',
                        fontWeight : 'bold'
                    },
                    color : bordercolor_views_textfields,
                    left : '0dp',
                    //left : '10dp',
                    //right : '10dp'
                    //bottom : '10dp'
                });
                heading_report.add(heading_report_label);
                var heading_status = Titanium.UI.createView({
                    width : '48%',
                    height : Ti.UI.SIZE,
                    //layout : 'horizontal',
                    horizontalWrap : false,
                    //right : '10dp',
                    //left : '10dp',
                    layout : 'absolute',
                    //backgroundImage : '/images/backblue.png'
                    backgroundColor : 'white',
                    left : '1%',
                    right : '1%',
                    padding : '10dp',
                });
                row.add(heading_status);

                var heading_status_label = Ti.UI.createLabel({
                    text : "" + a[i],
                    color : 'black',
                    font : {
                        fontSize : '20dp',
                        fontWeight : 'bold'
                    },
                    left : '0dp',

                });
                heading_status.add(heading_status_label);
                data.push(row);
                stableview.setData(data);
            }

I also tried adding this code snippet to the manifest file, but it didn't resolve the issue:

<android xmlns:android="http://schemas.android.com/apk/res/android">
    <manifest>
        <application android:theme="@style/Theme.MyTheme">
            <supports-screens android:largeScreens="true"
                android:normalScreens="true"
                android:smallScreens="true" android:xlargeScreens="true"/>
            <uses-sdk android:minSdkVersion="10" android:targetSdkVersion="19"/>
            <uses-permission android:name="android.permission.INTERNET"/>
            <uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>
            <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
            <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
        </application>
    </manifest>
</android>
javascriptandroidtableviewtitanium-mobileappcelerator-mobile

Answer №1

Recently, I made some updates to the code: 

var win = Titanium.UI.createWindow({
    title : 'Medall app',
    backgroundColor : '#fff',
    fullscreen : false,
    navBarHidden : true,
    layout : 'vertical',
});
var scrollView = Titanium.UI.createScrollView({
    width : Titanium.UI.FILL,
    top : '0dp',
    bottom : '0dp',
    layout : 'vertical',
    showVerticalScrollIndicator : true
});
win.add(scrollView);
var mainview = Titanium.UI.createView({
    width : Ti.UI.FILL,
    height : Ti.UI.FILL,
    layout : 'vertical',
    horizontalWrap : false,
    backgroundColor : 'white',
    bottom : '20dp'
});
scrollView.add(mainview);

var data = [];
var tableview = Titanium.UI.createTableView({
    backgroundColor : 'white',
    width : '90%',
    layout : 'horizontal',
    padding : '10dp',
    separatorColor : 'black',
    top : '0dp',
    borderColor : 'blue',
    scrollable : true
});
mainview.add(tableview);

var a=['1','2','3','4','5'];

for (var i = 0; i < a.length; i++) {
    var row = Ti.UI.createTableViewRow({
        height : '30dp',
        layout : 'vertical',
        className : 'row',
        objName : 'row',
        onClick : "delete",
        onPress : "rowvalue",
        backgroundColor : 'white',
        top : '10dp',
        padding : '10dp',
        width : '100%',
        horizontalWrap : false,
        layout : 'horizontal',
        backgroundColor : 'white',
        top : '10dp',
        padding : '10dp',
    });

    var heading_report = Titanium.UI.createView({
        width : '150dp',
        height : Ti.UI.SIZE,
        horizontalWrap : false,
        layout : 'vertical',
        backgroundColor : 'white',
        left : '0dp',
        padding : '10dp',
    });    
    row.add(heading_report);

    var heading_report_label = Ti.UI.createLabel({
        text : a[i],
        font : {
            fontSize : '20dp',
            fontWeight : 'bold'
        },
        color : 'black',
        left : '0dp',
    });
    heading_report.add(heading_report_label);
    var heading_status = Titanium.UI.createView({
        width : '48%',
        height : Ti.UI.SIZE,
        horizontalWrap : false,
        layout : 'absolute',
        backgroundColor : 'white',
        left : '1%',
        padding : '10dp',
    });
    row.add(heading_status);

    var heading_status_label = Ti.UI.createLabel({
        text : "" + a[i],
        color : 'black',
        font : {
            fontSize : '20dp',
            fontWeight : 'bold'
        },
        left : '0dp',
    });
    heading_status.add(heading_status_label);
    data.push(row);
    tableview.setData(data);
}
win.open();

The above code is now running smoothly without the need for any adjustments in the manifest tag.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Compel instantaneous XMLHttpRequest / Ajax without any prior notification

It's no secret that synchronous XMLHttpRequest has been deprecated due to its negative impact on user experience. The deprecation of Synchronous XMLHttpRequest on the main thread is a result of its adverse effects on end users' experience. For ...

javascriptjqueryajaxxmlhttprequest

transforming a cylindrical shape into a curved pipe

Utilizing the capabilities of three.js, I have successfully engineered a captivating scene featuring a textured and meshed cylinder along with a grid boasting lines and vertices. By manipulating the mouse to the left or right, the cylinder elegantly spins ...

javascripthtml5-canvasthree.js

What is the best way to keep an image centered in the nav-bar as it decreases in size?

As I work on building a website using a template (https://github.com/learning-zone/web-templates/tree/master/victory-school-free-html5-bootstrap-template), I encountered an issue with the navigation bar. The original design appears like this: Before shrin ...

javascripthtmlcss

Trouble with jQuery: Tackling a Basic String and Variable Issue

I'm having trouble incorporating my variable into this specific string: var liPad = 20; $(this).css({'width' : width , 'height' : height, 'padding' : "'0px' + liPad + 'px'"}); The desired outcome is ...

javascriptstring-concatenation

Adjust the position of an image to move it closer to the top using CSS

I have a fiddle where I am trying to adjust the position of an image (keyboard) to match a specific design. https://i.sstatic.net/flqCH.png In my fiddle, the keyboard image is slightly lower than the desired position shown in the design. I am looking for ...

javascripthtmlcsstwitter-bootstrap-4

What could be the reason for my CORS headers not aligning even though they appear to be identical?

I encountered an issue while using passport js with REACT. When trying to fetch the logged in user data, I faced a problem where the cors header of fetch didn't match even though they are identical. Here is the endpoint I am sending the fetch request ...

javascriptreactjsajaxcorspassport.js

What is the best way to incorporate AngularJS data into JavaScript for use in Google Chart?

How can I leverage my AngularJS scope data in a Google Chart or JavaScript? Below is my AngularJS file: angular.module('reports').controller('ReportInfoCtrl', ['$scope', 'reports', '$rootScope','$loca ...

javascriptangularjsangularjs-directiveangularjs-scopegoogle-visualization

Concurrency-proof Singleton implementation

I have been working on a project where I am using a singleton class to store data. However, I am facing an issue where the Service class is creating a new instance of the singleton instead of using the existing one. I have searched multiple posts on GitHub ...

javaandroidmultithreadingservicesingleton

Selecting an element from CSS using Jsoup

Is it possible to retrieve all images that do not have the first class attribute as "content.slide0"? In my example, I am utilizing the Jsoup library to display selectable elements in a WebView. Elements element = doc.select("HERE_SOLUTION"); <head ...

androidjqueryhtmlcssjsoup

Using Angular's ng-repeat alongside a bootstrap input checkbox, make sure to incorporate a dynamic ng-model and utilize ng-

This particular issue is proving to be a bit challenging for me to articulate, but I'll give it my best shot. I'm currently working on implementing Angular checkboxes with their ng-true-value attribute in conjunction with a dynamic ng-model. < ...

javascriptangularjstwitter-bootstrapcheckbox

Navigating around potential type errors when passing data for chart.js can be challenging. Here are some strategies to

I'm currently working on an application that includes a chart, and I'm facing an issue while trying to populate the chart with data from my store. The error occurs when I attempt to pass the chartData object through props to the data property of ...

javascriptvue.jschart.jsnuxt.js

Troubleshooting: Vue.js custom select element not responding to blur event

Unique Scenario A custom autocomplete select component has been created that not only autocompletes but also allows for adding a new value if the result is not found. This functionality was discovered to be missing in the vue-select module. Explore the C ...

javascriptvue.js

Issue: Package 'cairo' not located on EC2 Bitnami MEAN server

Setting up my MEAN application on a Bitnami server has been quite a challenge. During the installation of dependencies, I encountered an error that I just can't seem to resolve. Despite following the instructions provided in the error message, I am st ...

javascriptnode.jsamazon-ec2bitnami

Is there a way to split each foreach value into distinct variables?

I am looking to assign different variables to foreach values. I have fetched data from an API in JSON format, and then echoed those values using a foreach loop. My goal is to display the echoed value in an input box using JavaScript. I attempted the follow ...

javascriptphphtml

The process of utilizing the override feature in the package.json file to make updates to child dependencies

There seems to be a vulnerability in the async package that I want to update to version 3.2.2. Here is the dependency tree if I use npm list async: └─┬ [email protected] └─┬ [email protected] └── [email protected] After referring t ...

javascriptnode.jsnpm

Error: The function subscribe in _store_js__WEBPACK_IMPORTED_MODULE_12__.default is not supported

In my main App component, I am subscribing to the store in a normal manner: class App extends Component { constructor(props) { super(props) this.state = {} this.unsubscribe = store.subscribe(() => { console.log(store.getState()); ...

javascriptreactjsnpmreact-reduxredux-saga

Tips for managing Express.js callbacks and modifying an object's property from within a function

I am currently working with two JavaScript files. I have successfully retrieved data from MongoDB using the method bookDao.getActiveBookByCategoryId(). The Issue I Am Facing: Within the categoryDao.js file, I am attempting to update the resultJson.book_c ...

javascriptnode.jsmongodbexpresscallback

Tapping a precise X,Y coordinate on the AndroidViewClient

How can I accurately tap a specified X,Y coordinate on the screen with AndroidViewClient? ...

androidmonkeyrunnerandroidviewclient

Tips for utilizing a variable selector with jQuery's .attr() method

In a jQuery DataTable, there is a scenario where some values can be modified by clicking an edit button. When clicked, a modal popup appears with a form to enter new values for notes and status: ... "columnDefs": [ { ...

javascriptjqueryajaxdatatable

The issue of Storybook webpack failing to load SCSS files persists

I'm running into an issue where my styles are not loading in Storybook, even though I'm not getting any errors. Can someone help me out? My setup involves webpack 2.2.1. I've scoured Stack Overflow and GitHub for solutions, but nothing seem ...

javascriptreactjswebpacksassstorybook