Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-19523] IOS: ImageView within ListView with defaultImage set is not resized accordingly to remote image

GitHub Issuen/a
TypeBug
PriorityCritical
StatusClosed
ResolutionFixed
Resolution Date2015-10-23T23:43:24.000+0000
Affected Version/sn/a
Fix Version/sn/a
ComponentsiOS
LabelsTCSupportTriage, defaultImage, height, imageview, ios, listview, load
ReporterLev
AssigneeAngel Petkov
Created2014-08-29T10:33:17.000+0000
Updated2018-05-23T09:06:46.000+0000

Description

I have a listview, which displays remote images of different dimensions. While images are loaded, I show defaultImage with spinner. Here's a template I have for this
{
    bindId: 'main',
    properties: {height: Ti.UI.SIZE},
    childTemplates: [
        {
            type: 'Ti.UI.ImageView',
            bindId: 'image',
            properties: {
                width: Ti.UI.SIZE,
                height: Ti.UI.SIZE,
                defaultImage: 'icon_spinner_wide.png'
            }
        }
    ]
}
Once list is displayed, default image is shown, and ImageView has height and width according to default image. The problem is that as soon as remote image is loaded (and cached), it is displayed, but the height remains same as it was for default image. If I open the list 2nd time, it works fine, because the image is not remote anymore and could be shown immediately, without default image. I've tried to add event listener to 'load' event for image (in order to adjust list item height), so template looks like this:
type: 'Ti.UI.ImageView',
bindId: 'image',
properties: {
    width: Ti.UI.SIZE,
    height: Ti.UI.SIZE,
    defaultImage: 'icon_spinner_wide.png'
},
events: {
    load: function(e) {
        alert('hello');
    }
}
but unfortunately as soon as 'load' event handler is declared, I get following error on listview.setSections: *** setObjectForKey: object cannot be nil (key: section) If I add handler for click event, it works. Probably these 2 issues are connected. Also it works on Android (both resize after remote image is loaded and load event).

Comments

  1. Angel Petkov 2015-10-12

    Hello , the new release of the titanium SDK(5.1.0) should fix the current bugs with the imageView. The image will now be resized to it's original size or to a specified one. Example code :
     
       
       var win = Ti.UI.createWindow({
           backgroundColor: 'white'
       });
       var myTemplate = {
       
           properties: {
               height: 100,
               backgroundColor: 'red'
           },
           childTemplates: [{
               type: 'Ti.UI.ImageView',
               bindId: 'image',
               properties: {
                   width: 100,
                   height: 100,
                   defaultImage: 'default_app_logo.png',
                   backgroundColor: '#ccc'
               }
           }]
       };
       var sections = [
           Ti.UI.createListSection({
               items: [{
                   image: {
                       image: 'http://cdn.slidesharecdn.com/profile-photo-appcelerator-48x48.jpg?cb=1416396285',
                       backgroundColor: 'blue',
                       width: Ti.UI.SIZE,
                       height: 200
                   }
               }]
           })
       ];
       
       var listView = Ti.UI.createListView({
           templates: {
               'template': myTemplate
           },
           defaultItemTemplate: 'template',
           sections: sections,
           top: 20
       });
       
       
       win.add(listView);
       win.open();
       
       
  2. Harry Bryant 2015-10-23

    Verified as fixed, using example code provided by [~apetkov] ImageView can now be resized accordingly. Tested on: iOS 9.1, 8.4 Devices. iOS 9.0 & 8.4 Simulators. Mac OSX El Capitan 10.11 (15A284) Studio: 4.4.0.201510231805 Ti SDK: 5.1.0.v20151022152020 Appc NPM: 4.2.1-6 Appc CLI: 5.1.0-38 Ti CLI: 5.0.4 Xcode 7.1(7B91b) Node v4.2.1 production *Closing Ticket.*
  3. Igor Kalashnikov 2017-08-27

    Hello, bug still exist on 6.1.2.GA on iOS Size of remote image after loading remains the same, I need to update ListItem to fix this, but if I add onLoad event to ImageView inside ListView I got error: ListView:
       <Alloy>
           <ListView id="cardListContainer">
               <Templates>
                   <ItemTemplate name="startTimePhotoV">
                       <ImageView 
                               bindId="photo" 
                               onClick="showFullImageHandler" 
                               onLoad="updateItemOnLoad"
                               defaultImage="/images/make_photo_overlay_0.2.png" 
                               class="w-fill h-size">
                       </ImageView>
                   </ItemTemplate>
               </Templates>
               <ListSection id="cardListSection">
                   <ListItem></ListItem>
               </ListSection>
           </ListView>
       </Alloy>
       
    ERROR: {noformat} [ERROR] The application has crashed with an uncaught exception 'NSInvalidArgumentException'. [ERROR] Reason: [ERROR] *** setObjectForKey: object cannot be nil (key: section) [ERROR] Stack trace: [ERROR] 0 CoreFoundation 0x0000000113dedd33 __exceptionPreprocess + 147 [ERROR] 1 libobjc.A.dylib 0x000000011338521e objc_exception_throw + 48 [ERROR] 2 CoreFoundation 0x0000000113d03d87 -[__NSDictionaryM setObject:forKey:] + 1047 [ERROR] 3 GO-OD 0x000000010c24d35a -[TiUIListItemProxy overrideEventObject:forEvent:fromViewProxy:] + 362 [ERROR] 4 GO-OD 0x000000010c00ba39 -[TiViewProxy fireEvent:withObject:propagate:reportSuccess:errorCode:message:] + 297 [ERROR] 5 GO-OD 0x000000010c0ac12b -[TiProxy fireEvent:withObject:] + 139 [ERROR] 6 GO-OD 0x000000010c0928e8 -[TiUIImageViewProxy propagateLoadEvent:] + 408 [ERROR] 7 GO-OD 0x000000010c0956d2 -[TiUIImageView fireLoadEventWithState:] + 66 [ERROR] 8 GO-OD 0x000000010c09638d -[TiUIImageView setURLImageOnUIThread:] + 1053 [ERROR] 9 GO-OD 0x000000010c0991ea __40-[TiUIImageView imageLoadSuccess:image:]_block_invoke + 42 [ERROR] 10 libdispatch.dylib 0x00000001181b1808 _dispatch_call_block_and_release + 12 [ERROR] 11 libdispatch.dylib 0x00000001181d312e _dispatch_client_callout + 8 [ERROR] 12 libdispatch.dylib 0x00000001181ba4fb _dispatch_main_queue_callback_4CF + 1054 [ERROR] 13 CoreFoundation 0x0000000113db1e49 __CFRUNLOOP_IS_SERVICING_THE_MAIN_DISPATCH_QUEUE__ + 9 [ERROR] 14 CoreFoundation 0x0000000113d7737d __CFRunLoopRun + 2205 [ERROR] 15 CoreFoundation 0x0000000113d76884 CFRunLoopRunSpecific + 420 [ERROR] 16 GraphicsServices 0x0000000114d84a6f GSEventRunModal + 161 [ERROR] 17 UIKit 0x000000010f4dac68 UIApplicationMain + 159 [ERROR] 18 GO-OD 0x000000010bfc69b4 main + 100 [ERROR] 19 libdyld.dylib 0x000000011821c68d start + 1 [ERROR] 20 ??? 0x0000000000000001 0x0 + 1 {noformat}
  4. Sergey Volkov 2018-05-23

JSON Source