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

Native Development

Reply
New Developer
Posts: 19
Registered: ‎12-06-2013
My Device: Q5
My Carrier: WIFI

Function for update data ( pull to refresh )

[ Edited ]

Hi,

 

I'm using c++ for pull to refresh I need know how add function in QML for update data?

 

c++:

#include "pulltorefresh.h"
#include <bb/cascades/ActivityIndicator>
#include <bb/cascades/Color>
#include <bb/cascades/Container>
#include <bb/cascades/DockLayout>
#include <bb/cascades/FadeTransition>
#include <bb/cascades/ImageView>
#include <bb/cascades/Label>
#include <bb/cascades/LayoutUpdateHandler>
#include <bb/cascades/StackLayout>
#include <bb/cascades/StockCurve>
#include <bb/cascades/SystemDefaults>
#include <bb/cascades/TouchType>

using namespace bb::cascades;

PullToRefresh::PullToRefresh(bb::cascades::Container* parent) :
        CustomControl(parent), mControl(0), mRefreshActive(false), mToBeRefreshed(false)
{
    mActivityIndicator = ActivityIndicator::create().preferredSize(100, 100);

    mLabelLoading = Label::create("Loading...").vertical(VerticalAlignment::Center).textStyle(
            SystemDefaults::TextStyles::bigText()).leftMargin(40);

    mActivityContainer = Container::create().layout(
            StackLayout::create().orientation(LayoutOrientation::LeftToRight)).vertical(
            VerticalAlignment::Center).horizontal(HorizontalAlignment::Left).visible(false).add(
            mActivityIndicator).add(mLabelLoading);

    mImage = ImageView::create("asset:///images/arrow_down.png").vertical(
            VerticalAlignment::Center);

    mLabel = Label::create(tr("Pull to refresh")).vertical(VerticalAlignment::Center).textStyle(
            SystemDefaults::TextStyles::bigText()).leftMargin(40);

    mInstContainer = Container::create().layout(
            StackLayout::create().orientation(LayoutOrientation::LeftToRight)).vertical(
            VerticalAlignment::Center).horizontal(HorizontalAlignment::Left).add(mImage).add(
            mLabel);

    Container * innerContainer = Container::create().layout(
            StackLayout::create().orientation(LayoutOrientation::LeftToRight)).vertical(
            VerticalAlignment::Center).horizontal(HorizontalAlignment::Left).left(60).add(
            mInstContainer).add(mActivityContainer);

    mRootContainer = Container::create().layout(DockLayout::create()).add(innerContainer).vertical(
            VerticalAlignment::Fill).horizontal(HorizontalAlignment::Fill);

    setRoot(mRootContainer);


    mLayoutUpdateHandler = LayoutUpdateHandler::create(this);
    connect(mLayoutUpdateHandler, SIGNAL(layoutFrameChanged(const QRectF &)),
            SLOT(onLayoutFrameChanged(const QRectF &)));
}

PullToRefresh::~PullToRefresh()
{
}

void PullToRefresh::onLayoutFrameChanged(const QRectF& layoutFrame)
{

    if (!mActivityIndicator->isRunning()) {
        if (layoutFrame.y() > 0) {

            mImage->setRotationZ(180);
            mLabel->setText(tr("Release to refresh"));
            mToBeRefreshed = true;

        } else if (layoutFrame.y() < 0) {

            mImage->setRotationZ(0);
            mLabel->setText(tr("Pull to refresh"));
            mToBeRefreshed = false;

        }

        mInstContainer->setVisible(true);
        mActivityContainer->setVisible(false);
    }
}

void PullToRefresh::onListViewTouch(bb::cascades::TouchEvent* event)
{
    if (event->touchType() == TouchType::Up && mToBeRefreshed) {

        mActivityIndicator->setRunning(true);
        mLabel->setText(tr("Updating..."));
        mInstContainer->setVisible(false);
        mActivityContainer->setVisible(true);
        mRefreshActive = true;
        mToBeRefreshed = false;
        emit refreshActiveChanged(mRefreshActive);
    }
}

bb::cascades::Control* PullToRefresh::control()
{
    return mControl;
}

void PullToRefresh::setControl(bb::cascades::Control *control)
{
    mControl = control;
    if (!connect(mControl, SIGNAL(touch(bb::cascades::TouchEvent*)),
            SLOT(onListViewTouch(bb::cascades::TouchEvent*)))) {
        qWarning() << "connectToTouchSignal failed";
    }
    emit controlChanged(mControl);
}

void PullToRefresh::refreshDone()
{
    FadeTransition *anim1 = FadeTransition().create().to(0).duration(500).target(mLabelLoading).easingCurve(
                    StockCurve::CubicOut).parent(this);
    FadeTransition *anim2 = FadeTransition().create().to(0).duration(500).target(mActivityIndicator).easingCurve(
                    StockCurve::CubicOut).parent(this);

    connect(anim2, SIGNAL(ended()), this, SLOT(resetStates()));
    anim1->play();
    anim2->play();
}

void PullToRefresh::resetStates()
{
    // Reset all the states of the control.
    mActivityIndicator->setRunning(false);
    mRefreshActive = false;
    mToBeRefreshed = false;
    mLabel->setText(tr("Pull to refresh"));
    mActivityIndicator->setOpacity(1.0);
    mLabelLoading->setOpacity(1.0);
    emit refreshActiveChanged(mRefreshActive);
}

bool PullToRefresh::refreshActive()
{
    return mRefreshActive;
}

 

In QML in listview:

leadingVisual: PullToRefresh {
                        id: pullToRefresh
                        control: alist
                        preferredHeight: 256
                        
                        onRefreshActiveChanged: {
                            if (active) {
                                // Once the user has decided to refresh call the data source to update.
                                dsw.revAtTop(); // dsw id in DataSource
                            }                
                        }
                    }

 

Now how to make function for "revAtTop" to refresh  data? * I'm not sure, Is this true? *

 

Is there any help or correct? Cat Happy

Highlighted
New Developer
Posts: 19
Registered: ‎12-06-2013
My Device: Q5
My Carrier: WIFI

Re: Function for update data ( pull to refresh )

 

You must be a source of data written in c++?

Iam using QML

Developer
Posts: 237
Registered: ‎05-21-2012
My Device: BlackBerry RED Z10
My Carrier: WiFi

Re: Function for update data ( pull to refresh )

I actually don't understand well your problem.

 

Do you want to insert the new data in your data model? because I see in your code that it already has the signal when the pull to refresh happens.

 

Read more about here how to populate a ListView https://developer.blackberry.com/native/reference/cascades/bb__cascades__listview.html

New Developer
Posts: 19
Registered: ‎12-06-2013
My Device: Q5
My Carrier: WIFI

Re: Function for update data ( pull to refresh )

 

^^^^^

 

My problem now is how to add new data in the data model, when using ( pull to refresh ).

 

I need how to make this in qml?

When using "PullToRefresh"  I add function "revAtTop" now how to load new data in this function using QML?

 

leadingVisual: PullToRefresh {
                        id: pullToRefresh
                        control: alist
                        preferredHeight: 256
                        
                        onRefreshActiveChanged: {
                            if (active) {
                                // Once the user has decided to refresh call the data source to update.
                                dsw.revAtTop(); // dsw id in DataSource
                            }                
                        }
                    }