www.YoYoBrain.com - Accelerators for Memory and Learning

Questions for Sencha TouchCategory: Default - (203 questions)Sencha Touch: the base library for SenchaTouch is ______

Sench Platform

Sencha Touch: widget which is a floatingmodal panel that animates into view

Sheet

Sencha Touch: sheet widget is a subclass of_____

Panel

Sencha Touch: purpose of ActionSheetwidget

subclass of Sheet that allows you to renderbuttons in a vertical row, to ask user to make

a decision

Sencha Touch: ____ widget provides analert-like functionality

MessageBox

Sencha Touch: 3 provided data bound views DataViewListNestedList

Sencha Touch: widget that binds to a datastore and gives you 100% control on howyou will render your data

DataView

Sencha Touch: what is needed to stamp outHTML fragments in DataView widget

XTemplate

Sencha Touch: widget that is data boundand renders a native list view

List

Sencha Touch: data bound widget fordisplaying nested lists

NestedList

Sencha Touch: widget that wraps Googlemaps

Map

Sencha Touch: 4 tap related events tapstarttapendtapdoubletab

Sencha Touch: utility function that can beused to configure Sencha Touch for use onmobile device

Ext.setup( )

Sencha Touch: config option to run codewhen browser is booted on Ext.setup

onReady

Sencha Touch: how to register application inapp.js

Ext.regApplication( { } );

Sencha Touch: how to run code afterregistration when using Ext.regApplication( )

launch: function( ) {}

Sencha Touch: how to create a model Ext.regModel("MyModel", {});

Sencha Touch: how to create a store Ext.regStore()Sencha Touch: how to connect view withdata

store: Ext.StoreMgr.get('MyStore')

Sencha Touch: how to create a viewextending List

MyApp.MyList = Ext.extend( Ext.List, {});

Sencha Touch: how to register a class withComponent Manager for lazy registration

Ext.reg('MyList', MyApp.MyList )

Sencha Touch: how to tell List how to renderdata from store

itemTpl: '{lastName}, {firstName}'

Sencha Touch: widget for forms Ext.form.FormPanel

Sencha Touch: how to tell FormPanel thedefault widget to use for form fields

defaultType: 'textfield'

Sencha Touch: how to tell application to runin full screen mode

Ext.setup configfullscreen: true

Sencha Touch: how to set startup screenduring bootstrap for phone / tables

Ext.setup config optionstabletStartupScreen:URLphoneStartupScreen: URL

Sencha Touch: how to set the icon forgeneral / phone / tablets

in Ext.setup configicon: URLtabletIcon:URLphoneIcon: URL

Sencha Touch: how to config iOS top-moststatus bar style

in Ext.setup configstatusBarStyle

Sencha Touch: how to set a model to localstorage

in Ext.regModel configproxy : { type:'localstorage', ...}

Sencha Touch: how to set text for List whenthere are no items to show

emptyText: 'Nothing to see here'

Sencha Touch: how to get a store to grabdata in a view

this.store.load()

Sencha Touch: how to control direction aFormPanel scrolls in

scroll: 'vertical'

Sencha Touch: how to supply default configoptions for FormPanel display items

defaults { labelWidth: 20}

Sencha Touch: how to add docked elementsto top / bottom / left / right of Panel

dockedItems: [ ]

Sencha Touch: how to create a toolbar fortop of Panel

dockedItems: [{ xtype: 'toolbar', dock : 'top',title: "Something clever"}]

Sencha Touch: how to dispatch events Ext.dispatch( { } )Sencha Touch: how to grab a record by indexfrom store

myStore.getAt(index)

Sencha Touch: how to create a new modelrecord

Ext.ModelMgr.create( { }, 'ModelName' )

Sencha Touch: how to get DataView toupdate view

myView.updateRecord( record )

Sencha Touch: how to grab current databeing used in DataView

dataView.getRecord( )

Sencha Touch: ___ is the class all widgetsare based on

Ext.Component

Sencha Touch: 3 phases of component lifecycle

InitializationRenderDestruction

Sencha Touch: 1st thing that happens incomponent initialization

the Component config options are applied

Sencha Touch: in Component initializationphase, what happens after Componentconfig is applied

Base Events are registered

Sencha Touch: where do core events comefrom in Ext.Component

Ext.Observable

Sencha Touch: how to set observers onComponent events

listeners: { beforeHide: function() {}}

Sencha Touch: in Component initialization,what happens after base observers are set

the component is given a unique ID

Sencha Touch: where are all componentsregistered and managed

Ext.ComponentMgr

Sencha Touch: how to assign an id tocomponent that only has to be unique withina given container

use itemId instead of id

Sencha Touch: in component initializationphase, what happens after unique id isassigned

initComponent is executed

Sencha Touch: what happens afterinitComponent is called in Componentinitialization

Component is registered withComponentMgr

Sencha Touch: what happens next inComponent initialization after Component isregistered with ComponentMgr

plugins are registered

Sencha Touch: what triggers rendering ofComponent automatically in initializationphase

if renderTo or applyTo parameters have beenset

Sencha Touch: how to explicitly get aComponent to draw

.render( )

Sencha Touch: what happens to "myThing"in code belowmyPanel.render("myThing")

adds "myThing" as element ID in DOM

Sencha Touch: first thing that happens inComponent render phase

beforerender event is fired

Sencha Touch: how to prevent rendering ofComponent in code

hook into beforerender event and return false

Sencha Touch: in Component render phase,what happens after beforerender event

the Container is set

Sencha Touch: difference in using renderToversus applyTo when Component isrendering

renderTo - adds div to container specifiedand renders this component in divapplyTo -

puts this component's content insidereferenced div

Sencha Touch: what happens in Componentrender phase after container is set

onRender is executed and all DOM elementsare inserted to hold custom content

Sencha Touch: in Component render phasewhat happens after onRender is executed

render event is fired

Sencha Touch: in Component render phase,what happens after render event is fired

content is initialized, with internal HTML andstyling applied

Sencha Touch: 2 ways to inject customHTML content into Component

html - raw HTML stringcontentEl - points toexisting HTML's id and uses it

Sencha Touch: how to create customcomponent content that generates byiterating over data objects

data: [{ name: "Joe", age: 20 },......]tpl: '(name) - (sex)'

Sencha Touch: in Component render cycle,what happens after custom content isinjected

afterRender method is executed. This is toposition the content properly.

Sencha Touch: in Component render cycle,what happens after afterRender is executed

afterrender event is fired

Sencha Touch: what is the LazyInstantiation syntax for creating a component

var myPanel = { xtype: 'panel', html: "I'mlazy"}Ext.ComponentMgr.create(myPanel).s

how();Sencha Touch: ____ is behind the scenesclass that helps Component managechildren items

Container

Sencha Touch: 2 ways to add componentsinto a Component's container

.add( ).insert( )

Sencha Touch: how to grab a Componentwith its itemId

Ext.getCmp('myName')

Sencha Touch: how to tell a component torepaint itself

.doLayout()

Sencha Touch: how to remove a componentfrom another component's container

.remove( )

Sencha Touch: how to remove a componentwithout destroying it so you can put itsomewhere else

2nd option parameter, set tofalsemyPanel.remove(myField, false)

Sencha Touch: how to get a handle on directchildren of Component

getComponent( )can pass index, id or itemId

Sencha Touch: how to find direct childbased on CSS like selector

.child( )

Sencha Touch: how to find children at anylevel of hierarchy using CSS like selectors

.down( ) - returns a single element.query( ) -returns an array of matches

Sencha Touch: layout that sizes child item tofit within the confines of its parent

FitLayoutlayout: 'fit'

Sencha Touch: 2 abstract layouts all otherlayout's extend

ComponentLayoutContainerLayout

Sencha Touch: what is the defaultcomponent layout and its way of showingcontent

AutoComponentLayoutstacks onecomponent over another

Sencha Touch: what is the default container'slayout and its effect

AutoContainerLayoutstacks one componentover another

Sencha Touch: what is Card layout Each sub component is full screen with onlyone card shown at a time

Sencha Touch: how to manage which cardis shown in CardLayout at render time

activeItemconfig option

Sencha Touch: how to change which card isshown in CardLayout component

setActiveIndex

Sencha Touch: 2 layouts to stack itemsvertically and horizontally

HBoxVBox

Sencha Touch: when using hbox layout whatare config options to control horizontal /vertical alignment

pack - horizontalalign - vertical

Sencha Touch: what are values for packwhen using hbox layout

start, center, end, justify

Sencha Touch: what are values for alignconfig option when using hbox layout

start, center, end, stretch

Sencha Touch: how to have content take upweight amount of space in hbox layout

use flex configthe flex values are summed upand each component is given weighted

spacing

Sencha Touch: how to dock items at outeredges of Ext.Panel

configdockedItems: [ ]

Sencha Touch: when creating a dockedItemcontainer how to tell it where to place item

use config optiondock: 'top' , 'bottom', 'left','right'

Sencha Touch: how to add / remove dockeditems from Panel

addDockedremoveDocked

Sencha Touch: how to force rendering ofPanel's docked items

doComponentLayout()

Sencha Touch: how to grab a docked item inPanel

getDockedComponent( )

Sencha Touch: get a list of all currentlydocked items

getDockedItems()

Sencha Touch: how to create a floating /draggable Panel

config optionsdraggable: truefloating: true

Sencha Touch: how to position a floatingpanel

floatingPanel.setPosition(50, 50)

Sencha Touch: how to turn on floating anddragging after Component is instantiated

.setFloating( ).setDragging( )

Sencha Touch: how to make a floatingComponent modal

config optionmodal: true

Sencha Touch: on modal Component how toturn off default behavior of hiding when usertaps outside Component

hideOnMaskTap: false

Sencha Touch: how to set show / hideanimations on popup Panel

showAnimation: 'fade'hideAnimation: 'pop'

Sencha Touch: Component used togenerate space between components

xtype: 'spacer'

Sencha Touch: how to turn a button into icon config:iconCls: 'search'icon class - must mapto one of the icons included in SASS files

Sencha Touch: what is the default xtype foritems in a toolbar

'button'

Sencha Touch: how to set code to buttonclick in button Component

handler: function() {}

Sencha Touch: how to set what this keywordwill point to when Button handler is run

scope: myObject

Sencha Touch: how to set alignment ofbutton icon

iconAligncan be: 'top', 'bottom', 'right', 'left'

Sencha Touch: how to control visibility ofButton icon image

config optioniconMask

Sencha Touch: how to alter appearance ofbuttons based on built in themes

configui: 'action'

Sencha Touch: TabPanel uses specialbuttons called ____ located in a specialToolbar called ____

TabTabBar

Sencha Touch: how to control tab switchanimation

cardSwitchAnimation

Sencha Touch: component type to hold formwidgets

FormPanel

Sencha Touch: xtype for form text fields 'textfield'

Sencha Touch: xtype for form select boxes selectfield

Sencha Touch: how to set drop down valuesfor 'selectfield' widget

options: [ { text: 'Arkansas', value: 'AR }, ...]

Sencha Touch: how to put instruction text inForm text field

config optionplaceholder:

Sencha Touch: how to retrieve all valuesfrom FormPanel

myForm.getValues()

Sencha Touch: how to turn on auto creation,capitalization, and completion in Form textfields

config optionsautoCorrect:trueautoCapitalize: trueautoComplete: true

Sencha Touch: how to attach label to aForm field widget

label: 'Name'

Sencha Touch: on Form text field what iseffect of optionrequired: true

puts an asterisk next to field but does not dovalidation

Sencha Touch: xtypes for URL, number andemail fields

urlfieldnumberfieldemailfield

Sencha Touch: xtype for password fields passwordfield

Sencha Touch: xtype for Form text area textareafield

Sencha Touch: xtypes for Form check boxand radio buttons

checkboxradio

Sencha Touch: xtype for date selection field datepickerfield

Sencha Touch: xtype for number spinnerform field

spinnerfield

Sencha Touch: xtype that implements nativeSencha slider

sliderfield

Sencha Touch: xtype Form field that allowstoggling field like on / off switch

togglefield

Sencha Touch: how to create a Data Storethat pulls JSON from server

Ext.data.JsonStore { proxy: {}}

Sencha Touch: widget used to group Formfields and has a title

xtype: 'fieldset'

Sencha Touch: when using Fieldset to groupForm items, 2 options to give user feedbackon what to do

title: 'Personal Information'instructions:"Enter first and last name:"

Sencha Touch: syntax to submit a form toserver

myForm.submit( { url: 'form-submit', success:function() {}, failure: function() {}});

Sencha Touch: format of data server mustreturn after Form submission

[success: true, msg: "Something clever" ]

Sencha Touch: how to grab a model withname string

Ext.ModelMgr.getModel('myModel')

Sencha Touch: how to grab model datawhen model has proxy

myModel.load( id, {success: function(){},failure: function() {}});

Sencha Touch: how to put values in Formfrom Model that has returned from load

myForm.loadRecord( theRecord )

Sencha Touch: how to put values in formwith the record in JavaScript object format

myForm.setValues(dataObject)

Sencha Touch: how to update underlyingmodel record being used on a form

myForm.updateRecord(myForm.record)

Sencha Touch: default layout type for aPanel

layout: 'auto'

Sencha Touch: how does layout: 'auto'handle vertical versus horizontal space

will take all horizontal space but only neededvertical space to render

Sencha Touch: how to get Panel to take allhorizontal and vertical space

layout: 'fit'

Sencha Touch: 2 special widgets thatprovide auto handling of card type layout

TabPanelCarousel

Sencha Touch: what is only layout allowedfor TabPanel

'card', applied automatically and any otherlayout is ignored

Sencha Touch: how to control swipingdirection of Carousel

direction: 'vertical' / 'horizontal'

Sencha Touch: when using vbox, how tohave items take all horizontal space

align: 'stretch'

Sencha Touch: how to layout data fromStore in a DataView widget

tpl: new Ext.XTemplate( '',....,'')

Sencha Touch: what class handlestemplating

Ext.Template

Sencha Touch: how to hook a store toHTML5 sessionStorage object

proxy: { type: 'sessionStorage', id:'mySessionStore' }

Sencha Touch: when does icon andphoneStartupScreen images get used fromExt.startup

if user saves page to home screen, the iconis used for app and when launched from

there phoneStartupScreen image is usedduring launch

Sencha Touch: how to grab access toTabBar portion of TabPanel

myPanel.getTabBar()

Sencha Touch: how to tell button to use iconimage only

iconMask: true

Sencha Touch: when using tpl withExt.Component how to cause it to draw data

myCompent.update(dataObj)

Sencha Touch: how to request script fromoutside domain source ( cross domainrequest )

Ext.util.JSONP.request( {url: ....}

Sencha Touch: how to prevent caching ofquery requests

add a param with unique valueparams: { un:Math.random()}

Sencha Touch: how to get Map to center oncurrent location

useCurrentLocation: true

Sencha Touch: how to get access to currentcoordinates from Map

var coords = myMap.geo.coords

Sencha Touch: what object handles the userlocation

GeoLocation

Sencha Touch: what event doesGeoLocation fire when location is received

myMap.geo.on('update', function);

Sencha Touch: how to create a namespacefor scoping variables

Ext.namespace('Company.data')orExt.ns( )

Sencha Touch: how to add validation to amodel

validations : [ {type: ... }]

Sencha Touch: how to validate in Modelensuring a field has a value

validations: [{type: 'presence', name:'field_name' }]

Sencha Touch: how to connect one Model toanother

associations: [ { type: 'hasMany', model:'MyModel', name: 'Something' }]

Sencha Touch: how to set background colorof Panel

style: "background-color: white"

Sencha Touch: how to attach custom classesto Panel

cls: "name"

Sencha Touch: how to put data fields intoXTemplate

by using {varName} syntaxtpl:"{name}"

Sencha Touch: where are templateformatting helpers located in Ext classsystem

Ext.util.Format

Sencha Touch: how to include data inTemplate that has HTML characters

{name.htmlEncode}

Sencha Touch: syntax for callingExt.util.Format functions in Template

{myVar:utilFunction}or if it hasparameters{myVar:ellipsis(140, true)}

Sencha Touch: how to loop in XTemplate

Sencha Touch: type of quotes to use forXTemplate tpl tag definition

single quotes on outside with double quoteson inside''

Sencha Touch: in XTemplate, how to loop ondata items that are arrays

{.} for data value'','{.}',''

Sencha Touch: how to do conditionals inXTemplate

Sencha Touch: how to handle characters in XTemplate conditionals

replace with < and >

Sencha Touch: how to access loop index {#}index + 1Sencha Touch: how to insert pure JavaScriptinto XTemplate

{[ JavaScript here ]}

Sencha Touch: XTemplate - how to accesscurrent variable in inline JavaScript

{ [ values ] }

Sencha Touch: how to get parents of currentobject in inner loop

parent keyword{ parent.something }

Sencha Touch: how to do XTemplatefunctions without having to escape HTMLcharacters

Ext.Template( ) can take a config as lastparameter and functions can be defined in it{

myFunction: function() {}}Sencha Touch: how to call config functions inXTemplate

if="this.myFunction"using this keyword toaccess

Sencha Touch: XTemplate JavaScriptvariables for index and count of loop items

xindexxcount

Sencha Touch: class for hiding elements class="x-hidden-display"

Sencha Touch: how to load XTemplate fromDOM element

Ext.XTemplate.from("id")

Sencha Touch: how to turn off including alldefault icons

in sencha-touch.scss@include-default-icons:false;

Sencha Touch: how to include specific iconsin css

in sencha-touch.scss@includepictos-iconmask('action')

Sencha Touch: in what folder do icons gowhen you use them in sencha-touch.scsswith @include pictos-iconmask('name')

themes/images/default/pictos

Sencha Touch: how to change basic colorused in sencha theme

in sencha-touch.scss file$base-color:#...;$base-gradient: 'glossy';

Sencha Touch: tool included to create olderstyle CSS effects like rounded corners

sencha slice theme

Sencha Touch: how to attach a listener toDOM elements of Panel

listeners: { el: { tap: function() {} }}or can usebody instead of el

Sencha Touch: how to add event listener topanel after creation

myPanel.addListener( { } )

Sencha Touch: how to add a custom eventto a widget

this.addEvents('myevent')

Sencha Touch: how to trigger a customevent

this.fireEvent('myEvent', type, event)

Sencha Touch: how to make an eventlistener only respond to first event

single: true

Sencha Touch: how to put a delay betweenevent happening and firing of event

delay: 3000

Sencha Touch: how to group things in Listwidget

grouped: truegetGroupString:function(record) {}

Sencha Touch: how to sort records in Listview

sorters: 'fieldName'

Sencha Touch: how to get an index in List toallow Navigation

indexBar: true

Sencha Touch: how to include disclosureicon for List items

onItemDisclosure: true / function() {}

Sencha Touch: what type of store is neededfor NestedList

Ext.data.TreeStore

Sencha Touch: type of reader forExt.data.TreeStore

reader : { type: 'tree' }

Sencha Touch: function to respond to leafnode being tapped in NestedList

getDetailCard

Sencha Touch: how to change the field usedfor displaying an item

displayField

Sencha Touch: how to change NestedListdisplay using a function

getItemTextTpl

Sencha Touch: how to add badge to bottomToolbar

in configbadgeText: "1"

Sencha Touch: how to define a customTabBar ui style type

add to them .scss file@includesencha-toolbar-ui('myUI', base-color,

gradient, activeColor );