height


Increase scrollview's element height on clicking it


I am new to famo.us like everybody else.
I cannot think of a way to increase the height of each item (probably surface) inside my scrollview on clicking that item.
Eg. like below list view below
item 1
item 2
item 3
Now Clicked item 2
item 1
item 2
details of item 2
item 3
Here is a way I was able to achieve clicking to adjust height. It gets a bit more complicated is you want to animate the size.
Here is the simple click example..
Hope it helps!
var Engine = require('famous/core/Engine');
var Surface = require('famous/core/Surface');
var Scrollview = require('famous/views/Scrollview');
var surfaces = [];
var scrollview = new Scrollview();
scrollview.sequenceFrom(surfaces);
for (var i = 0; i < 5; i++) {
var surface = new Surface({
size:[undefined,200],
properties: {
backgroundColor:'hsl('+(i*360/8)+',100%,50%)'
}
});
surface.open = false;
surface.on('click',function(){
var size = this.open ? [undefined,200] : [undefined,400] ;
this.setSize(size);
this.open = !this.open;
}.bind(surface));
surfaces.push(surface);
surface.pipe(scrollview);
};
context.add(scrollview);

Related Links

change line height in sublime text default theme after changing the font-size
How to have autogrow children with flexbox?
Kalman Filter for height and acceleration
Isotope last items in row with equal height
How to set the detail height programatically in ActiveReports
Looking for a way to change the fixed height of page header in Access 2007
CSS Background image not showing with height auto
Binary Tree find height of a specific Node
Re-size the Text and Button/Label in Livecode
Overlay a background image onto the web page
WooCommerce - change price based on product_id, width and height
Susy gallery breaks height for display table and table-cell
Flex Slider full height and width without stretching
mPDF set Height for SetHTMLHeader
How to Set Height of PdfPTable in iTextSharp
Margin not showing with 100% width & height

Categories

HOME
json
jar
ncurses
bing
agile
avro
mapbox-gl-js
survival-analysis
checksum
phaser-framework
algorithmic-trading
quill
java-home
websphere-liberty
onenote-api
hashicorp-vault
scala-native
lstm
riak
python-unicode
raphael
cocoa-touch
tcpclient
non-deterministic
opencart2.3
dhtmlx-scheduler
svnkit
construct-2
honeysql
google-guava-cache
boilerplate
bing-maps-api
mms
zero
stdclass
taglib
pytest-django
openweathermap
fqdn
bnd
photon-controller
static-code-analysis
festival
rmongodb
glkit
activeweb
tomcat5
jackson-databind
brython
ng2-material
financial
approval-tests
sem
playscape
guzzle6
stackframe
word-2013
jcr-sql2
symfony-2.6
libsndfile
facebook-wall
power-law
ifft
svcutil.exe
flash-cc
edit-in-place
nuspec
socketstream
feof
sunspot-rails
getusermedia
macruby
jpf
querystringparameter
nsindexpath
getresource
querypath
windows-controls
kpi
opcodes
writing

Resources

Mobile Apps Dev
Database Users
javascript
java
csharp
php
android
MS Developer
developer works
python
ios
c
html
jquery
RDBMS discuss
Cloud Virtualization
Database Dev&Adm
javascript
java
csharp
php
python
android
jquery
ruby
ios
html
Mobile App
Mobile App
Mobile App