Android Question Image Alignment within CustomListView

[PhilNewbie]

I'm trying to add two columns of images within a CustomListView but am having problems aligning them.

I created a separate layout with two two labels and two B4XImageViews, , where the IVs are exactly the same. This is added to the CLV as per the lines of code below. I've copied them out of the main app for clarity.
For development purposes I've used the same image in both IVs with background colours set so that I can better see what's going on.

If I set the Orientation of the app to Landscape I can see both images but if set to Portrait then only one appears.
Within the designer I have the following scripts:

B4XMainPage layout:
'All variants script
AutoScaleAll
CustomListViewLyrics.SetTopAndBottom(PanelNav.Bottom +2dip,99%y)
CustomListViewLyrics.SetLeftAndRight(0,75%x)
PanelTOC.SetLeftAndRight(0,100%y)
clvChords.SetLeftAndRight(CustomListViewLyrics.Right,100%x)
clvChords.SetTopAndBottom(PanelNav.Bottom + 1dip,100%y)

asong layout:
'All variants script
AutoScaleAll
B4XIVchord2.SetLeftAndRight(B4XIVchord1.Right,228dip)


I have tried to set it up so that I have a 75% / 25% split between the song lyrics and the chord diagrams but maybe that wouldn't be necessary if I could get the images to align next to each.

So the question is what am I doing wrong or not doing at all. How do I align each images correctly and get rid of the excess space within each panel.

..........................................................................................................

Sub Class_Globals
    Private B4XIVchord1 As B4XImageView
    Private B4XIVchord2 As B4XImageView
    Private clvChords As CustomListView

Private Sub FetchPage (PageNo As Int)  As Boolean    
    Dim chordimage2 As Bitmap
    Dim cl As List

    chordimage2 = LoadBitmapResize(File.DirAssets,"guitar.jpg",92dip,100dip,True)
    For x = 0 To cl.Size -1
             Dim thischord As B4XImageView
             Dim p As B4XView = xui.CreatePanel("")
             p.SetLayoutAnimated(0,0,0,100%x,125dip)
             p.LoadLayout("asong")
             Log("IV = " & p.GetView(0).Tag & "  " & "L = " & p.GetView(0).Left & " W = " & p.getview(0).Width)
             B4XIVchord1.Bitmap = chordimage2
             B4XIVchord2.Bitmap = chordimage2
              clvChords.Add(p,thischord)
    Next
...............................................................................................................  






[ATTACH type="full" width="627px"]116732[/ATTACH]
#SupportedOrientations: Landscape

[ATTACH type="full" width="627px"]116733[/ATTACH]
#SupportedOrientations: Portrait



On a completely different question, how /where can I get the nice looking emulator that I see in all of the videos. This one is very clunky. Can't get rid of the keyboard part and it doesn't change orientation correctly.

Phil

 

[Erel]

1. Please use [code]code here...[/code] tags when posting code.
2. Don't use the emulator at all. Use a real device. The "emulator" in the video tutorials is a real device mirrored with a software called Reflector.
3. Assuming that you resized the B4XImageViews correctly, you can change the Resize Mode to make it fill the space.

If you are unable to solve it then upload the project.

 

[PhilNewbie]

Once again Erel, thanks for your prompt response.
Sorry about the tags. I had added the the opening tags but missed off the [\code]

I've had a try with resize etc and have eventually got it looking something like ok.
Next I need to get to grips with the workings of Canvas in order to draw the chord diagrams. I'm hoping that I can use a jpeg of the fretboard onto which I can draw the finger positions. I also have a table of the positions of the frets for each string so in theory should be OK. However, they refer to the original bitmap in the jpeg file.
Is it possible to read that, draw on it and then rescale it before adding it to the CIV?

Regards
Phil

 

[Erel]

Is it possible to read that, draw on it and then rescale it before adding it to the CIV?

You can draw anything you like and add it to CLV.