Android Question Product "browser"

luke2012 said:

Hi to all.
I have to choose a GUI to show a list of products (record with product pic & description) to allow the customer to choose like a movie browser (see the attached pic).

In other words, I'm looking 4 a new way to display this kind of catalog apps.
What do you think about ?

Click to expand...

Informatix said:

You can use the Coverflow library available on this forum. If you can't achieve what you want with it, I can provide you with my own version (a different implementation with more settings) against a little donation.

Click to expand...

• CoverFlow
  Events:
  • ItemClick (Position As Int)
  • ItemLongClick (Position As Int)
  • ItemSelected (Position As Int)
  • NeedBitmap (Position As Int) As Object
  • NeedBitmapCount As Int
  Methods:
  • AddBitmap (Bmp As BitmapWrapper)
    Adds a bitmap to the list.
    This function is ignored if WithList = false.
  • BitmapCount As Int
    Returns the number of items in the bitmap list.
  • BringToFront
    Changes the Z order of this view and brings it to the front.
  • ClearBitmapList
    Clears the bitmap list. This function is ignored if WithList = false.
  • Initialize (ImageWidth As Int, ImageHeight As Int, WithList As Boolean, WithReflection As Boolean, EventName As String)
    Initializes the CoverFlow view.
    ImageWidth: maximum width of images.
    ImageHeight: maximum height of images.
    WithList: if true, all bitmaps are retrieved from a list populated with AddBitmap. If false, each bitmap is requested when needed by the NeedBitmap event (NeedBitmapCount is called before to return the number of bitmaps) and Refresh must be called to update the gallery.
    WithReflection: if true, a reflection effect is added under each image.
    EventName: prefix of the event handlers (myEventName_ItemClick, myEventName_ItemLongClick, myEventName_ItemSelected, myEventName_NeedBitmap).
  • Invalidate
    Invalidates the whole view forcing the view to redraw itself. Redrawing will only happen when the program can process messages. Usually when it finishes running the current code.
  • Invalidate2 (Rect As Rect)
    Invalidates the given rectangle.
    Redrawing will only happen when the program can process messages. Usually when it finishes running the current code.
  • Invalidate3 (Left As Int, Top As Int, Right As Int, Bottom As Int)
    Invalidates the given rectangle.
    Redrawing will only happen when the program can process messages. Usually when it finishes running the current code.
  • IsInitialized As Boolean
  • Refresh
    Updates the contents of the gallery (the bitmaps displayed).
    Calls to this function are only required if WithList = false.
    It cannot be called in Activity_Create and must be called at least once after Initialize.
  • RemoveView
    Removes this view from its parent.
  • RequestFocus As Boolean
    Tries to set the focus to this view. Returns True if the focus was set.
  • SendToBack
    Changes the Z order of this view and sends it to the back.
  • SetBackgroundImage (Bitmap As Bitmap)
  • SetLayout (Left As Int, Top As Int, Width As Int, Height As Int)
    Changes the view position and size.
  • SetSpacing (Value As Int)
    Sets the spacing between images (default = -15).
  Properties:
  • Background As Drawable
    Gets or sets the background drawable.
  • Color As Int [write only]
    Sets the background of the view to be a ColorDrawable with the given color.
    If the current background is of type GradientDrawable or ColorDrawable the round corners will be kept.
  • Enabled As Boolean
  • Height As Int
  • ImageReflectionRatio As Float
    Gets/sets the image reflection ratio (default = 0.3).
  • Left As Int
  • MaxRotationAngle As Int
    Gets/sets the maximum rotation angle of each image (default = 60).
  • MaxZoom As Int
    Gets/sets the maximum zoom of the central image (default = -120).
  • ReflectionGap As Float
    Gets/sets the reflection gap.
  • ReflectionIntensity As Int
    Gets/sets the reflection intensity (from 0:dark to 255:bright).
  • Selection As Int
    Gets/sets the selected item.
  • Tag As Object
    Gets or sets the Tag value. This is a place holder which can used to store additional data.
  • Top As Int
  • Visible As Boolean
  • Width As Int
    Gets or sets the view's width.

Informatix said:

It is designed with a different philosophy. The images can be supplied in real-time or loaded before displaying the gallery. So you can adapt the loading to the number and size of images to display. Another difference is that I don't put images in a cache. You have to use my Cache library if you need to (and the result will be more effective than the solution chosen by lonelystar which should be named "temp storage with very short life" to be precise). Another difference is that the gallery is able to scale properly the images (you can have different sizes and aspect ratios).
Here all the methods and properties:

• CoverFlow
  Events:
  • ItemClick (Position As Int)
  • ItemLongClick (Position As Int)
  • ItemSelected (Position As Int)
  • NeedBitmap (Position As Int) As Object
  • NeedBitmapCount As Int
  Methods:
  • AddBitmap (Bmp As BitmapWrapper)
    Adds a bitmap to the list.
    This function is ignored if WithList = false.
  • BitmapCount As Int
    Returns the number of items in the bitmap list.
  • BringToFront
    Changes the Z order of this view and brings it to the front.
  • ClearBitmapList
    Clears the bitmap list. This function is ignored if WithList = false.
  • Initialize (ImageWidth As Int, ImageHeight As Int, WithList As Boolean, WithReflection As Boolean, EventName As String)
    Initializes the CoverFlow view.
    ImageWidth: maximum width of images.
    ImageHeight: maximum height of images.
    WithList: if true, all bitmaps are retrieved from a list populated with AddBitmap. If false, each bitmap is requested when needed by the NeedBitmap event (NeedBitmapCount is called before to return the number of bitmaps) and Refresh must be called to update the gallery.
    WithReflection: if true, a reflection effect is added under each image.
    EventName: prefix of the event handlers (myEventName_ItemClick, myEventName_ItemLongClick, myEventName_ItemSelected, myEventName_NeedBitmap).
  • Invalidate
    Invalidates the whole view forcing the view to redraw itself. Redrawing will only happen when the program can process messages. Usually when it finishes running the current code.
  • Invalidate2 (Rect As Rect)
    Invalidates the given rectangle.
    Redrawing will only happen when the program can process messages. Usually when it finishes running the current code.
  • Invalidate3 (Left As Int, Top As Int, Right As Int, Bottom As Int)
    Invalidates the given rectangle.
    Redrawing will only happen when the program can process messages. Usually when it finishes running the current code.
  • IsInitialized As Boolean
  • Refresh
    Updates the contents of the gallery (the bitmaps displayed).
    Calls to this function are only required if WithList = false.
    It cannot be called in Activity_Create and must be called at least once after Initialize.
  • RemoveView
    Removes this view from its parent.
  • RequestFocus As Boolean
    Tries to set the focus to this view. Returns True if the focus was set.
  • SendToBack
    Changes the Z order of this view and sends it to the back.
  • SetBackgroundImage (Bitmap As Bitmap)
  • SetLayout (Left As Int, Top As Int, Width As Int, Height As Int)
    Changes the view position and size.
  • SetSpacing (Value As Int)
    Sets the spacing between images (default = -15).
  Properties:
  • Background As Drawable
    Gets or sets the background drawable.
  • Color As Int [write only]
    Sets the background of the view to be a ColorDrawable with the given color.
    If the current background is of type GradientDrawable or ColorDrawable the round corners will be kept.
  • Enabled As Boolean
  • Height As Int
  • ImageReflectionRatio As Float
    Gets/sets the image reflection ratio (default = 0.3).
  • Left As Int
  • MaxRotationAngle As Int
    Gets/sets the maximum rotation angle of each image (default = 60).
  • MaxZoom As Int
    Gets/sets the maximum zoom of the central image (default = -120).
  • ReflectionGap As Float
    Gets/sets the reflection gap.
  • ReflectionIntensity As Int
    Gets/sets the reflection intensity (from 0:dark to 255:bright).
  • Selection As Int
    Gets/sets the selected item.
  • Tag As Object
    Gets or sets the Tag value. This is a place holder which can used to store additional data.
  • Top As Int
  • Visible As Boolean
  • Width As Int
    Gets or sets the view's width.

Click to expand...

luke2012 said:

Very interesting !
Can I see some sample screen of rectangular images in portrait mode ?

Click to expand...

Informatix said:

View attachment 22014

EDIT: I saw a bit too late that you asked the portrait mode....

Click to expand...

luke2012 said:

Yes this is the effect I wish... but in portrait mode with a short description text in the bottom of the foreground image.

Click to expand...

Informatix said:

For the main menu of My Playground, I use my Coverflow library with a label below.
The orientation does not matter for the library.

Click to expand...

luke2012 said:

Very cool App!
Orientation does not matter : do you mean that the library manage portrait & landscape mode?

Click to expand...