Scrollview with 8 bitmaps across AND a title below

joolzg

Member
Licensed User
Longtime User
Ive been looking through (lots) of examples but not seen any that have a text description below the bitmap

What i was looking for was a scrollview with max 8 bitmaps across by ?? down.

Each bitmap would have a short description, 20 chars, below.

The idea is to be able to scroll up/down and select 1 from the block.

Any pointers

joolz
 

klaus

Expert
Licensed User
Longtime User
Did you have a look at ScrollView example summary there are quite some examples tolook at?
Attached you find one of these examples modified with a Label below each Image.
I leave it up to you to adapt it to your needs.

Best regards.
 

Attachments

  • ImageScrollViewLabel.jpg
    ImageScrollViewLabel.jpg
    71.1 KB · Views: 25,789
Upvote 0

joolzg

Member
Licensed User
Longtime User
ok so can you help on this

B4X:
Sub BuildChannelScreen
   Dim i As Int
   Dim x As Int
   Dim y As Int
   Dim e As Element
   Dim a As Int
   Dim ac As Int
   Dim d As Int
   
   a = (Activity.Width*3)/4
   a = a / 72
   d = (Activity.Height*3)/4
   d = d / 72
   d = d * 72
   e = cHead
   imgSpace = 8
   y = 0
   scvImages.Initialize( a * 72)
   scvImages.Color = Colors.ARGB( 224, 128, 128, 128)
   ac = 0
   For i=0 To cCount-1
      Dim imvImage As ImageView                                                         
      Dim lbl As Label

      imvImage.Initialize("imvImage")
      lbl.Initialize("")
      x = ac * 72
      x = x + 4
      y = (i /a)
      y = y * 72
      y = y + 4
      imvImage.Gravity=Gravity.FILL
      imvImage.Tag = e.cNumber   'i
      imvImage.Bitmap = e.pIcon
      scvImages.Panel.AddView( imvImage, x, y, 64, 64)
      scvImages.Panel.AddView( lbl, x+48, y, 64, 64)
      lbl.Tag = i
      lbl.Color = Colors.White
      lbl.Text = e.cTitle
      lbl.TextColor = Colors.Black
      lbl.TextSize = 16
      lbl.Gravity = Gravity.CENTER_HORIZONTAL + Gravity.CENTER_VERTICAL
      e = e.NextElement
      ac = ac + 1
      If ac=a Then
         ac = 0
      End If
   Next
   scvImages.Panel.Width = a * 72
   scvImages.Panel.Height = y + 72
   Activity.AddView( scvImages, (Activity.Width-(a*72))/2, (Activity.Height-d)/2, scvImages.Panel.Width, d)
End Sub

What i need help on is when and where to use "dip"

What this code does is walk through a linked list of channels and puts each icon on the screen, now i try and fill the screen by taking the with of the activity and using 3/4 width and height

My icons all all 64x64

joolz
 
Upvote 0

klaus

Expert
Licensed User
Longtime User
I don't understand exactly what you want to do and the code snippet doesn't show it really.
Do you want to have several images side by side ?
Are the Lable widths only 64 pixels ?

Could you post your project or a smaller one showing the problem as a zip file (IDE menu Files / Export As Zip).
It would much easier to help you.

What i need help on is when and where to use "dip"
It depends what physical size you want your icons on the screen on devices with different scales.
If you have a device (3.5 inches screen) with a width of 320 pixels (scale 1), 64 pixels represent 1/5 of the screen width.
If you have a device (3.5 inches screen) with a width of 480 pixels (scale 1.5), 64 pixels represent only 1/7.5 of the screen width. The physical size is 1.5 times smaller.
To have the icons the same physical size on both devices you must use 64dip. In that case on a device with a scale of 1.5 the width of the icon will be 64 * 1.5 = 96 pixels but with the same physical size because the physical pixel size is smaller.

Best regards.
 
Upvote 0

joolzg

Member
Licensed User
Longtime User
OK a quick demo i took from my code to a couple of problems.

The code does 2 things

1. Channel Bar, took a bit of time to get this working on all 3 of my devices.
2. BuildChannelScreen which is what i need to do more work on
Need some way of using this with a remote control so what is needed is some way of highlighting a box and allowing UP/DOWN/LEFT/RIGHT to move around and RETURN to give back the chosen icon.

joolz
 

Attachments

  • test.zip
    9.5 KB · Views: 601
Upvote 0

madru

Active Member
Licensed User
Longtime User
Hi Joozg,

you actually facing the same problems I did……


attached is a sample that works with the cursor keys (Remote control), but unfortunately not 100% :(

the key up/down key press event is most of the times eaten by the Listview (?) and therefore the Activity_KeyPress events never fires.

this problems was raised in the forum already but unfortunately it is not solved


M

the zip does not contain the channel icons!!!!
 
Upvote 0

klaus

Expert
Licensed User
Longtime User
@joolzg
Attached you find a version that highlights and shows the informations of the selected channel.
The channel is selected by touching a channel in the scrollview.

For the channel information you could use Labels and an ImageView instead of drawing the the informations onto a Panel and change their Text and Bitmap properties.

Best regards.
 

Attachments

  • test1.zip
    9.7 KB · Views: 578
Upvote 0

madru

Active Member
Licensed User
Longtime User
Hi Klaus,

yes the file size was to big….

…Images attached as a separate ZIP's

very kind that you will have a look again :)

make sure you use the HW keys for moving the 'Selector'

M
 
Last edited:
Upvote 0

joolzg

Member
Licensed User
Longtime User
@joolzg
Attached you find a version that highlights and shows the informations of the selected channel.
The channel is selected by touching a channel in the scrollview.

For the channel information you could use Labels and an ImageView instead of drawing the the informations onto a Panel and change their Text and Bitmap properties.

Best regards.

Thanks, for some reason i did not think about highlighting the names, doh, had im my head a full block invert.

joolz
 
Upvote 0

klaus

Expert
Licensed User
Longtime User
Hi madru,

My idea was to add a hidden EditText view with EditText.RequestFocus at the end of the diffferent routines.
I tested the principle with a small test program only with labels in the ScrollView and this one works.
I had a look at your progam, added the principle above, but it doesn't work as we expect it.
Then I modified the test program and added Panels and Buttons like yours, this one didn't work either.
It seems that if there are more than one layer of objects in the ScrollView it doesn't work.
I modified the test program again with only Panels, only one layer, in the ScrollView showing the images, this one works also and is attached to this post.
You can adapt this principle to your application.

Best regards.
 
Upvote 0

madru

Active Member
Licensed User
Longtime User
Klaus,

thank you very much for looking into it :)

….but unfortunately your version behaves exactly the same as mine

open a 2nd activity in the
B4X:
Case KeyCodes.KEYCODE_DPAD_CENTER
'Activity.Title = "Selected Item " & Row & " / " & Col
StartActivity(whatever)
event and return to your main activity, after that the Activity_KeyPress never fires because the SV scrolls :( until you reach the beginning or end of the SV


any other idea ?

THX

M
 
Upvote 0

klaus

Expert
Licensed User
Longtime User
In the version I posted, the KEYCODE_DPAD_CENTER event was never raised, I thought that it was a problem with the Emulator, but it's the hidden EditText view that is consuming this event.
I added a second Activity in my version and launched the second activity with the LongClick event and this works, but the KEYCODE_DPAD_CENTER event still isn't raised.
So I added with the Reflection library the KeyPress event for the EditText view that trapps the KEYCODE_DPAD_CENTER event and this works.

Best regards.
 
Last edited:
Upvote 0

madru

Active Member
Licensed User
Longtime User
Hi Klaus,

little Problem, the StartActivity("test") does not work



java.lang.NullPointerException
at anywheresoftware.b4a.agraham.reflection.Reflection$6.onKey(Reflection.java:1039)
at android.view.View.dispatchKeyEvent(View.java:3850)
at android.view.ViewGroup.dispatchKeyEvent(ViewGroup.java:789)
at android.view.ViewGroup.dispatchKeyEvent(ViewGroup.java:789)
at android.view.ViewGroup.dispatchKeyEvent(ViewGroup.java:789)
at android.view.ViewGroup.dispatchKeyEvent(ViewGroup.java:789)
at com.android.internal.policy.impl.PhoneWindow$DecorView.superDispatchKeyEvent(PhoneWindow.java:1905)
at com.android.internal.policy.impl.PhoneWindow.superDispatchKeyEvent(PhoneWindow.java:1139)
at android.app.Activity.dispatchKeyEvent(Activity.java:2254)
at com.android.internal.policy.impl.PhoneWindow$DecorView.dispatchKeyEvent(PhoneWindow.java:1881)
at android.view.ViewRoot.deliverKeyEventToViewHierarchy(ViewRoot.java:2563)
at android.view.ViewRoot.handleFinishedEvent(ViewRoot.java:2538)
at android.view.ViewRoot.handleMessage(ViewRoot.java:1870)
at android.os.Handler.dispatchMessage(Handler.java:99)
at android.os.Looper.loop(Looper.java:130)
at android.app.ActivityThread.main(ActivityThread.java:3683)
at java.lang.reflect.Method.invokeNative(Native Method)
at java.lang.reflect.Method.invoke(Method.java:507)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:841)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:599)
at dalvik.system.NativeStart.main(Native Method)
 
Last edited:
Upvote 0

joolzg

Member
Licensed User
Longtime User
Add in the reflection code you posted into my code and it works thanks :sign0060: but with one caveat, i get double keys in the KeyPressed sub.

Ill try and post a small demo app tonight, unless someone knows the reason

joolz
 
Upvote 0

madru

Active Member
Licensed User
Longtime User
joolz,

are you opening a new activity from that code as well ?

….it only works for me if I use a timer to start the activity.

M
 
Upvote 0

klaus

Expert
Licensed User
Longtime User
@ madru,
I loaded the program from post #13 back from the forum in a new folder.
The program works with the Emulator, so I don't know what are the problems you have.

@What do you mean with 'get double keys' ?

I am using Android 8 and Reflection library version 1.90.

Best regards.
 
Upvote 0

madru

Active Member
Licensed User
Longtime User
Klaus,

verified your statement, it does work < API 13. in the emulator.

….the device I use uses API 13 and above

M
 
Last edited:
Upvote 0

joolzg

Member
Licensed User
Longtime User
Klaus

What i mean is my ScrollView opens up and gets focus, i press left on the remote and it skips across 2 places.

I put a Log statement in the code and i get the KeyCode twice for every key

joolz
 
Upvote 0
Top