B4J Question Moving background image

ElliotHC

Active Member
Licensed User
I am sending images down the screen over a background, I also have labels.

I need to have the background image slowly scrolling.. If I keep two backgrounds on the screen one following the other, how do I keep the new background image from over-writing the smaller images already moving?
 

sorex

Expert
Licensed User
place it at previouspicture.left-nextpicture.width ?

how are the images moving now?
 

ElliotHC

Active Member
Licensed User
I'm selecting a random image and then randomly putting it in a column, I don't have more than 10 images on the screen at any one time.

The images fall down the screen to a zone where I can 'Smash' them but I need the background to match the speed of the falling images..

As the images are constantly getting generated, I need the background to appear to be scrolling..

The big issue is that I've split the screen for the two players, player 2 is above at 180 degrees.. So the scrolling background needs to seem to feed out of nowhere from the middle of the screen.

B4X:
Sub Release_Logo
    
    'For Image_Count = 1 To 100
    Random_Pos = Rnd(1,5)
    If Random_Pos = Random_Pos_Last Then
        Random_Pos = Rnd(1,5)
    End If
    Random_Pos_Last = Random_Pos
        
    Select Random_Pos
        Case 1
            X_Pos = Image_Left_Post
        Case 2
            X_Pos = Image_Left_Post + Logo_Space
        Case 3
            X_Pos = Image_Left_Post + Logo_Space + Logo_Space
        Case 4
            X_Pos = Image_Left_Post + Logo_Space + Logo_Space + Logo_Space
    End Select
    
    Random_Image = Rnd(1,5)
    If Random_Image = Random_Image_Last Then
        Random_Image = Rnd(1,5)
    End If
    Random_Image_Last = Random_Image
        
    Select Random_Image
        Case 1
            im.Initialize("C:/Smash","pepsi.png") ' your image file
        Case 2
            im.Initialize("C:/Smash","youtube.png") ' your image file
        Case 3
            im.Initialize("C:/Smash","coke.png") ' your image file
        Case 4
            im.Initialize("C:/Smash","ups.png") ' your image file
    End Select


    Select Image_count
        Case 1
            iv1.Initialize("iv1")
            iv1.SetImage(im)
            MainForm.RootPane.AddNode(iv1,X_Pos,Image_Start_Point,Image_Size,Image_Size)
            Dim jo As JavaObject = iv1 ' the imageview
            Dim o As Object = jo.CreateEvent("javafx.beans.value.ChangeListener","moved",False)
            jo.runmethodJO("layoutYProperty",Null).RunMethod("addListener",Array(o)) ' make sure you choose property that will change
            iv1.SetLayoutAnimated(Image_Speed,X_Pos,Image_Bottom_End,Image_Size,Image_Size) ' left/right up/down
        Case 2
            iv2.Initialize("iv2")
            iv2.SetImage(im)
            MainForm.RootPane.AddNode(iv2,X_Pos,Image_Start_Point,Image_Size,Image_Size)
            Dim jo As JavaObject = iv2 ' the imageview
            Dim o As Object = jo.CreateEvent("javafx.beans.value.ChangeListener","moved",False)
            jo.runmethodJO("layoutYProperty",Null).RunMethod("addListener",Array(o)) ' make sure you choose property that will change
            iv2.SetLayoutAnimated(Image_Speed,X_Pos,Image_Bottom_End,Image_Size,Image_Size) ' left/right up/down
        Case 3
            iv3.Initialize("iv3")
            iv3.SetImage(im)
            MainForm.RootPane.AddNode(iv3,X_Pos,Image_Start_Point,Image_Size,Image_Size)
            Dim jo As JavaObject = iv3 ' the imageview
            Dim o As Object = jo.CreateEvent("javafx.beans.value.ChangeListener","moved",False)
            jo.runmethodJO("layoutYProperty",Null).RunMethod("addListener",Array(o)) ' make sure you choose property that will change
            iv3.SetLayoutAnimated(Image_Speed,X_Pos,Image_Bottom_End,Image_Size,Image_Size) ' left/right up/down
        Case 4
            iv4.Initialize("iv4")
            iv4.SetImage(im)
            MainForm.RootPane.AddNode(iv4,X_Pos,Image_Start_Point,Image_Size,Image_Size)
            Dim jo As JavaObject = iv4 ' the imageview
            Dim o As Object = jo.CreateEvent("javafx.beans.value.ChangeListener","moved",False)
            jo.runmethodJO("layoutYProperty",Null).RunMethod("addListener",Array(o)) ' make sure you choose property that will change
            iv4.SetLayoutAnimated(Image_Speed,X_Pos,Image_Bottom_End,Image_Size,Image_Size) ' left/right up/down
        Case 5
            iv5.Initialize("iv5")
            iv5.SetImage(im)
            MainForm.RootPane.AddNode(iv5,X_Pos,Image_Start_Point,Image_Size,Image_Size)
            Dim jo As JavaObject = iv5 ' the imageview
            Dim o As Object = jo.CreateEvent("javafx.beans.value.ChangeListener","moved",False)
            jo.runmethodJO("layoutYProperty",Null).RunMethod("addListener",Array(o)) ' make sure you choose property that will change
            iv5.SetLayoutAnimated(Image_Speed,X_Pos,Image_Bottom_End,Image_Size,Image_Size) ' left/right up/down
        Case 6
            iv6.Initialize("iv6")
            iv6.SetImage(im)
            MainForm.RootPane.AddNode(iv6,X_Pos,Image_Start_Point,Image_Size,Image_Size)
            Dim jo As JavaObject = iv6 ' the imageview
            Dim o As Object = jo.CreateEvent("javafx.beans.value.ChangeListener","moved",False)
            jo.runmethodJO("layoutYProperty",Null).RunMethod("addListener",Array(o)) ' make sure you choose property that will change
            iv6.SetLayoutAnimated(Image_Speed,X_Pos,Image_Bottom_End,Image_Size,Image_Size) ' left/right up/down
        Case 7
            iv7.Initialize("iv7")
            iv7.SetImage(im)
            MainForm.RootPane.AddNode(iv7,X_Pos,Image_Start_Point,Image_Size,Image_Size)
            Dim jo As JavaObject = iv7 ' the imageview
            Dim o As Object = jo.CreateEvent("javafx.beans.value.ChangeListener","moved",False)
            jo.runmethodJO("layoutYProperty",Null).RunMethod("addListener",Array(o)) ' make sure you choose property that will change
            iv7.SetLayoutAnimated(Image_Speed,X_Pos,Image_Bottom_End,Image_Size,Image_Size) ' left/right up/down
        Case 8
            iv8.Initialize("iv8")
            iv8.SetImage(im)
            MainForm.RootPane.AddNode(iv8,X_Pos,Image_Start_Point,Image_Size,Image_Size)
            Dim jo As JavaObject = iv8 ' the imageview
            Dim o As Object = jo.CreateEvent("javafx.beans.value.ChangeListener","moved",False)
            jo.runmethodJO("layoutYProperty",Null).RunMethod("addListener",Array(o)) ' make sure you choose property that will change
            iv8.SetLayoutAnimated(Image_Speed,X_Pos,Image_Bottom_End,Image_Size,Image_Size) ' left/right up/down
        Case 9
            iv9.Initialize("iv9")
            iv9.SetImage(im)
            MainForm.RootPane.AddNode(iv9,X_Pos,Image_Start_Point,Image_Size,Image_Size)
            Dim jo As JavaObject = iv9 ' the imageview
            Dim o As Object = jo.CreateEvent("javafx.beans.value.ChangeListener","moved",False)
            jo.runmethodJO("layoutYProperty",Null).RunMethod("addListener",Array(o)) ' make sure you choose property that will change
            iv9.SetLayoutAnimated(Image_Speed,X_Pos,Image_Bottom_End,Image_Size,Image_Size) ' left/right up/down
        Case 10
            iv10.Initialize("iv10")
            iv10.SetImage(im)
            MainForm.RootPane.AddNode(iv10,X_Pos,Image_Start_Point,Image_Size,Image_Size)
            Dim jo As JavaObject = iv10 ' the imageview
            Dim o As Object = jo.CreateEvent("javafx.beans.value.ChangeListener","moved",False)
            jo.runmethodJO("layoutYProperty",Null).RunMethod("addListener",Array(o)) ' make sure you choose property that will change
            iv10.SetLayoutAnimated(Image_Speed,X_Pos,Image_Bottom_End,Image_Size,Image_Size) ' left/right up/down
    End Select
    
    Image_count = Image_count + 1
    If Image_count = 11 Then
        Image_count = 1
    End If

    
End Sub
 

Daestrum

Well-Known Member
Licensed User
If the second background is covering the smaller images, you have added the second background to the rootpane after the smaller images.
You would need to add the two backgrounds to the rootpane before you add the smaller images.
 

ElliotHC

Active Member
Licensed User
If the second background is covering the smaller images, you have added the second background to the rootpane after the smaller images.
You would need to add the two backgrounds to the rootpane before you add the smaller images.
Well that's a real problem because my smaller images are constantly getting generated :(
 

ElliotHC

Active Member
Licensed User
Can I have a section of background image, stick the smaller image on it and send them both down together?
 

Daestrum

Well-Known Member
Licensed User
You change their position and content, but that would not change their hierarchy in the rootpane.
They are effectively layers, so the two backgrounds would be added first, then add the smaller images, then set their contents and move them.
The first things added are at the back.
 

Cableguy

Expert
Licensed User
Use panes! It's by far the easiest solution.
You can imagine them as layers to your final "image"
 

sorex

Expert
Licensed User
put the background in a pane and the smaller ones in another pane that's added later to the root pane (or another pane)
 

ElliotHC

Active Member
Licensed User
I'm sending sections of the background down with each image but drawing the background sections first.. Seems to be working pretty well!
 
Top