ZupIT/beagle

Image changing size in TabBar

Closed this issue · 0 comments

Description

The Image is changging size inside Tab when user change active page by pressing a specific tab

This bug occur only on master

Steps To Reproduce

Provide a detailed list of steps that reproduce the issue.

  1. Create a TabBar with two pages with a Image inside

Expected Results

The Image should not change size when Tab animate to another page

Code example, screenshot, or link to a repository:

{
  "_beagleComponent_": "beagle:container",
  "context": {
    "id": "contextTab",
    "value": 0
  },
  "children": [
    {
      "_beagleComponent_": "beagle:tabbar",
      "onTabSelection": [
        {
          "_beagleAction_": "beagle:setContext",
          "contextId": "contextTab",
          "value": "@{onTabSelection}"
        }
      ],
      "currentTab": "@{contextTab}",
      "items": [
        {
          "icon": {
            "_beagleImagePath_": "local",
            "url": "public/beagle.png",
            "mobileId": "beagle"
          },
          "title": "Tab 1"
        },
        {
          "icon": {
            "_beagleImagePath_": "local",
            "url": "public/beagle.png",
            "mobileId": "beagle"
          },
          "title": "Tab 2"
        }
      ]
    },
    {
      "_beagleComponent_": "beagle:pageview",
      "currentPage": "@{contextTab}",
      "showArrow": false,
      "onPageChange": [
        {
          "_beagleAction_": "beagle:setContext",
          "contextId": "contextTab",
          "value": "@{onPageChange}"
        }
      ],
      "children": [
        {
          "_beagleComponent_": "beagle:image",
          "path": {
            "_beagleImagePath_": "remote",
            "url": "https://i.ibb.co/k9tYwtX/selo-do-exemplo-28420393.jpg"
          },
          "style": {
            "size": {
              "height": {
                "value": 250,
                "type": "REAL"
              },
              "width": {
                "value": 300,
                "type": "REAL"
              }
            },
            "margin": {
              "top": {
                "value": 10,
                "type": "REAL"
              }
            }
          }
        },
        {
          "_beagleComponent_": "beagle:image",
          "path": {
            "_beagleImagePath_": "remote",
            "url": "https://i.ibb.co/LCKYdCT/742px-Example-en-svg.png"
          },
          "style": {
            "size": {
              "height": {
                "value": 250,
                "type": "REAL"
              },
              "width": {
                "value": 300,
                "type": "REAL"
              }
            },
            "margin": {
              "top": {
                "value": 10,
                "type": "REAL"
              }
            }
          }
        }
      ]
    }
  ]
}

Simulator Screen Recording - iPhone 11 - 2021-05-12 at 09 15 17