How to make the layout like the picture below？

Ionic Framework ionic-v3
1

image

i try this，but not what i want

 <ion-item>
      <ion-thumbnail  item-start>
        <img src="">
      </ion-thumbnail >
      <h2>Woody</h2>
      <p>This town ain't big enough for the two of us!</p>
      <ion-note item-end>3:43</ion-note>
    </ion-item>
2

What does what you have look like?

3

image

image can click to expand or pack up

thank you

4

That is the same picture you posted in your first post. I was wondering what the Ionic thing you posted code for looks like and why this isn’t good.

What does the “popover” or “dropdown” look like? There are different ways to get something like that.

5

Thank you, very sorry because of my poor English, I solved the problem

6

Could you share the solution?

7

i try this code

   <ion-item>
      <ion-thumbnail  item-start>
        <img src="">
      </ion-thumbnail >
      <h2>Woody</h2>
      <p>This town ain't big enough for the two of us!</p>
      <div item-end >
        <h3 style="color: #8F999D">3:43</h3>
       <ion-note style="color: #8F999D;font-size: 13px;">未读</ion-note>
        <ion-icon name="ios-mail-outline"></ion-icon>
      </div>
    </ion-item>

is almost the same with demand

1 Like