How to resize rightButtons image?

[dhioetanasti]

I need to use buttons with image on the right side of navigation bar, but unable to resize the image, so i initially followed the docs => http://airbnb.io/native-navigation/docs/api/navigator-config.html and tried to do something like this

render() {
        const img = {
            uri:'../Icon/filter.png',
            height:23,
            width:25
        }
        const img2 = {
            uri:'../Icon/add.png',
            height:23,
            width:25
        }

        const btn = {
            image:img
        }
        const btn2 = {
            image:img2
        }

        let buttonArray = [btn, btn2]

        return (
            <Navigator.Config
                title= {'My App'}
                rightButtons={buttonArray}
                onRightPress={(index) => this.navBarButtonTapped(index)}
            >
            </Navigator.Config>
        );
}

but got a JSON value error

then i tried to do this

    import FilterImage from '../Icon/filter.png'
    import AddImage from '../Icon/plus.png'
    
    render() {
        let buttonArray = [{image: AddImage}, {}]

        return (
            <Navigator.Config
                title= {'My App'}
                rightButtons={buttonArray}
                onRightPress={(index) => this.navBarButtonTapped(index)}
            >
            {
                hasNoPromoAtAll ?
                    this.renderNoResult()
                    :
                    this.renderContent()
            }
            </Navigator.Config>
        );
    }

and it works, the images appear but i unable to resize the image that way, is there a way to do it properly?

Edit
my first way above works with uri being the name of the image asset on the native side (xcasset on iOS), but when i tried to define the height and the width, i got this error :Image source size {60, 60} does not match loaded image size {30, 30}.