Radlist View collapsible item animation

Question

I'm trying open and close the radlist view items's sub-details by tapping on any one of the item. So that it opens the sub view and closes again if i tap the item.

I have create a plaground sample where i have achieve collapsible radlist view https://play.nativescript.org/?template=play-js&id=jJqwjY&v=2

but i need to expand it slowly with animation. I read the documents little and searched on google with no result.

can anyone add animation to the above project which opens the collapsible view slowly from top to bottom. And closed slowly in the same way.

Updated:
i achieved relatively close animation somehow kindly look at this, https://play.nativescript.org/?template=play-js&id=jJqwjY&v=4

@keyframes animation {
    from { 
        height: 0;
        overflow:hidden;
        background-color: gold;
        transition: height 1s ease;
    }
    100% { 
        transform:   translate(0,0);
       /* height: auto */ // This is also not working
        height: 100px; } // HOW TO GIVE HEIGHT DYNAMICALLY HERE
}

because of hard-coded height i'm not getting accordion effect as different elements have different heights.