Project : Programming a Image-viewer with xBrowse

[ukoenig]

Hello,

working on a new Image-browser, I have 2 Questions about Cell-adjustments :

1. I want Images only resized ( adjusted to Cell-size) , if Image-size > Cell-Size, otherwise show original Image-size.
I used => oBrw:aCols[ 1 ]:lBmpStretch := .f., but the Image is always adjusted to Cellsize.

2. The vertical Imagetext, I couldn't get centered.
That doesn't work on vertical Text => oBrw:aCols[ 2 ]:nDataStrAlign := AL_CENTER

The Quantum of Columns / Rows, is calculated from a given Grid-size.



Best regards
Uwe

[nageswaragunupudi]

XBrowse resizes images only if the image does not fit in the cell size and never expands the image if the cell size is larger.

[ukoenig]

Thank You very much.
I understand with oBrw:aCols[ 3 ]:lBmpTransparent := .T.,
I can force a smaller Image to be adjusted to cell-size.
Could be a Option to adjust to Cellsize, but with a enlarged Image, I losing Quality.
I think, I will only use .F. ( default )
There is still my vertical Data-text-problem.
I tested with adding some Blanks at the Text-end, to move the Text to the Cell-center, but doesn't work.

It seems, it only works on Headers :

if FontEsc( oFont ) % 3600 == 900
...
...
DrawTextEx( hDC, cHeader,;
{ nBottom, nCol, nRow, nCol + nWidth }, ;
DT_LEFT + DT_VCENTER )




Best Regards
Uwe

[nageswaragunupudi]

As I said, xbrowse does not expand the imagesize on its own, unless instructed to stretch. This sample demonstrates the way to show images.

XBrowse can not handle vertical text in the data. We have to draw on our own. This sample demonstrates how to do it.

Screen Shot:


Sample Code:

Code: Select all

#include "FiveWin.Ch"
#include "xbrowse.ch"

#define DT_LEFT                     0x00000000
#define DT_VCENTER                  0x00000004

//----------------------------------------------------------------------------//

static aImg

//----------------------------------------------------------------------------//

function Main()

   local oDlg, oBrw, nCol, oVert

   aImg     := ReadImages( "C:\\FWH\\BITMAPS\\" )

   DEFINE FONT oVert NAME "TAHOMA" SIZE 0,-12 NESCAPEMENT 900 BOLD

   DEFINE DIALOG oDlg SIZE 522,560 PIXEL
   @ 10,10 XBROWSE oBrw SIZE -10,-10 PIXEL OF oDlg ;
      AUTOCOLS ARRAY aImg CELL LINES NOBORDER

   for nCol := 1 to 5 step 2
      WITH OBJECT oBrw:aCols[ nCol ]
         :nWidth        := 120
         :cDataType     := 'F'
         :nDataBmpAlign := AL_CENTER
      END
      WITH OBJECT oBrw:aCols[ nCol + 1 ]
         :oDataFont     := oVert
         :nWidth        := 24
         :bPaintText    := { | oCol, hDC, cData, aRect, aColors, lHighLite | ;
                           DrawVertText( oCol, hDC, cData, aRect, aColors, lHighLite ) }
      END

   next

   WITH OBJECT oBrw
      :nRowHeight       := 120
      :CreateFromCode()
   END

   ACTIVATE DIALOG oDlg CENTERED

return (0)

//----------------------------------------------------------------------------//

static function ReadImages( cFolder )

   local aFiles   := DIRECTORY( cFolder + "*.*" )
   local nLen     := Len( aFiles )
   local nRows    := Ceiling( Len( aFiles ) / 3 )
   local nRow, nCol, n, cFile

   aImg           := Array( nRows, 6 )

   nRow  := 1
   nCol  := 1
   for n := 1 to nLen
      cFile       := aFiles[ n, 1 ]
      aImg[ nRow, nCol ]      := cFolder + cFile
      aImg[ nRow, nCol + 1 ]  := cFile
      nCol        += 2
      if nCol > 6
         nRow++
         nCol     := 1
      endif
   next n

return aImg

//----------------------------------------------------------------------------//

static function DrawVertText( oCol, hDC, cData, aRect, aColors, lHighLite )

   local oBrw        := oCol:oBrw
   local nTop        := aRect[ 1 ]
   local nLeft       := aRect[ 2 ]
   local nBottom     := aRect[ 3 ]
   local nRight      := aRect[ 4 ]
   local nTxtWidth   := oBrw:GetWidth( cData, oCol:oDataFont )
   local nTxtHeight  := GetTextHeight( oBrw:hWnd, hDC )

   nBottom           := ( nTop + nBottom + nTxtWidth  ) / 2
   nLeft             := ( nLeft + nRight - nTxtHeight ) / 2

   DrawTextEx( hDC, cData, { nBottom, nLeft, nTop, nRight }, DT_LEFT + DT_VCENTER )

return nil

//----------------------------------------------------------------------------//
 

[ukoenig]

Mr. Rao,

Thank You very much for this Sample.
It works fine and I can start to add some more Options.
I noticed a small Problem :
moving the Scrollbar to the End ( Bottom ), I get a Errormessage.



Best Regards
Uwe

[nageswaragunupudi]

Thanks for pointing out. This is a bug. We are getting runtime error when the column's value is 'nil'.

This requires fix in xbrowse.prg. Please locate these lines in the method PaintData(...) of TXBrwColumn.

Code: Select all

   if ! Empty( cImagen ) .or. ::cDataType $ "FP"   // IMAGE
      if ! Empty( cImagen )
         hBmp     := FILoadFromMemory( cImagen )
      else
         if ::bStrImage == NIL
            cImagen := ::Value()
         else
            cImagen := Eval( ::bStrImage, Self, ::oBrw )
         endif
         if ::cDataType == 'F' .and. File( cImagen )
            hBmp     := FILoadImg( cImagen )
         else
            hBmp     := FILoadFromMemory( cImagen )
         endif
      endif
 

Please see the 3rd line from below:
For this line

Code: Select all

            hBmp     := FILoadFromMemory( cImagen )
 

substitute

Code: Select all

            hBmp     := FILoadFromMemory( IfNil( cImagen, '' ) )
 

[ukoenig]

Thank You very much, it works fine now.

The same, 10 Lines down from the change, must be changed as well :

Code: Select all

if ::cDataType == 'F' .and. File( cImagen )
     hBmp     := FILoadImg( cImagen )
else
     hBmp     := FILoadFromMemory( IfNil( cImagen, '' ) )  // change !!!!!!
endif
 

Best Regards
Uwe

[nageswaragunupudi]

The same, 10 Lines down from the change, must be changed as well :

This is the only change I meant. This is the same as 3rd line from "bottom"

[nageswaragunupudi]

I think this is what you originally wanted.

Here is the code:

Code: Select all

#include "FiveWin.Ch"
#include "xbrowse.ch"

#define DT_LEFT                     0x00000000
#define DT_CENTER                   0x00000001
#define DT_VCENTER                  0x00000004

#define BRW_COLS     6
//----------------------------------------------------------------------------//

static aImg

//----------------------------------------------------------------------------//

function Main()

   local oDlg, oBrw, nCol, oFont

   aImg     := ReadImages( "C:\\FWH\\BITMAPS\\" )

   DEFINE FONT oFont NAME "TAHOMA" SIZE 0,-12 BOLD

   DEFINE DIALOG oDlg SIZE 812,498 PIXEL
   @ 10,10 XBROWSE oBrw SIZE -10,-10 PIXEL OF oDlg ;
      AUTOCOLS ARRAY aImg LINES NOBORDER

   for nCol := 1 to Len( oBrw:aCols )
      WITH OBJECT oBrw:aCols[ nCol ]
         :nWidth        := 120
         :oDataFont     := oFont
         :nDataBmpAlign := AL_CENTER
         :bPaintText    := { | oCol, hDC, cData, aRect, aColors, lHighLite | ;
                           DrawCell( oCol, hDC, cData, aRect, aColors, lHighLite ) }
      END
   next

   WITH OBJECT oBrw
      :nRowHeight       := 140
      :CreateFromCode()
   END

   ACTIVATE DIALOG oDlg CENTERED

return (0)

//----------------------------------------------------------------------------//

static function ReadImages( cFolder )

   local aFiles   := DIRECTORY( cFolder + "*.*" )
   local nLen     := Len( aFiles )
   local nRows    := Ceiling( Len( aFiles ) / BRW_COLS )
   local nRow, nCol, n, cFile

   aImg           := Array( nRows, BRW_COLS )

   nRow  := 1
   nCol  := 1
   for n := 1 to nLen
      cFile       := aFiles[ n, 1 ]
      aImg[ nRow, nCol ]      := cFolder + cFile
      nCol++
      if nCol > BRW_COLS
         nRow++
         nCol     := 1
      endif
   next n

return aImg

//----------------------------------------------------------------------------//

static function DrawCell( oCol, hDC, cData, aRect, aColors, lHighLite )

   local oBrw        := oCol:oBrw
   local nTop        := aRect[ 1 ]
   local nLeft       := aRect[ 2 ]
   local nBottom     := aRect[ 3 ]
   local nRight      := aRect[ 4 ]

   local hBrush      := CreateSolidBrush( CLR_YELLOW )
   local hBmp, hBmpO, nBmpW, nBmpH, nBmpTop, nBmpLeft
   local nOldColor

   if ! Empty( cData )

      hBmp           := FILoadImg( cData )
      nBmpH          := nBmpHeight( hBmp )
      nBmpW          := nBmpWidth(  hBmp )
      if nBmpW > 116
         nBmpH    *= ( 116 / nBmpW )
         nBmpW    := 116
      endif
      if nBmpH > 116
         nBmpW    *= ( 116 / nBmpH )
         nBmpH    := 116
      endif
      if nBmpW != nBmpWidth( hBmp ) .or. nBmpH != nBmpHeight( hBmp )
         hBmpO    := hBmp
         hBmp     := ResizeBmp( hBmpO, nBmpW, nBmpH )
      endif
      nBmpTop     := nTop  + ( 116 - nBmpH ) / 2
      nBmpLeft    := nLeft + ( 116 - nBmpW ) / 2

      if HasAlpha( hBmp )
         ABPaint( hDC, nBmpLeft, nBmpTop, hBmp, oCol:nAlphaLevel() )
      else
         DrawBitmap( hDC, hBmp, nBmpTop, nBmpLeft )
      endif
      DeleteObject( hBmp )
      DeleteObject( hBmpO )
   endif

   DrawHorz( hDC, nTop + 120, nLeft - 4, nRight + 3, oBrw:hRowPen )
   FillRect( hDC, { nTop + 121, nLeft - 3, nBottom, nRight }, hBrush )

   if ! Empty( cData )
      nOldColor   := SetBkColor( hDC, CLR_YELLOW )
      DrawTextEx( hDC, cFileNoPath( cData ), { nTop + 121, nLeft, nBottom, nRight }, ;
                  DT_CENTER + DT_VCENTER )
      SetBkColor( hDC, nOldColor )
   endif

   DeleteObject( hBrush )

return nil

//----------------------------------------------------------------------------//
 

[ukoenig]

MUCH BETTER !!!!

I didn't know that it is possible, to mix Col-styles ( contents ) line-by-line.
That was the Reason, thinking about using a vertical extra Column on right-hand side for the Image-titles.

I noticed a quality-difference between both Solutions.
( added to first vertical textsample ) :lBmpTransparent := .T.



Thank You very much for the Help.

Best Regards
Uwe

[nageswaragunupudi]

I ignored lBmpTransparent in the DrawCell function above.
Please replace the function with this new function and try please.

Code: Select all

static function DrawCell( oCol, hDC, cData, aRect, aColors, lHighLite )

   local oBrw        := oCol:oBrw
   local nTop        := aRect[ 1 ]
   local nLeft       := aRect[ 2 ]
   local nBottom     := aRect[ 3 ]
   local nRight      := aRect[ 4 ]

   local hBrush      := CreateSolidBrush( CLR_YELLOW )
   local hBmp, hBmpO, nBmpW, nBmpH, nBmpTop, nBmpLeft
   local nold, lAlpha, nZeroClr

   if ! Empty( cData := oCol:Value() ) // note: cData is reassigned

      hBmp           := FILoadImg( cData )
      nBmpH          := nBmpHeight( hBmp )
      nBmpW          := nBmpWidth(  hBmp )
      if nBmpW > 116
         nBmpH    *= ( 116 / nBmpW )
         nBmpW    := 116
      endif
      if nBmpH > 116
         nBmpW    *= ( 116 / nBmpH )
         nBmpH    := 116
      endif
      nBmpTop     := nTop  + ( 116 - nBmpH ) / 2
      nBmpLeft    := nLeft + ( 116 - nBmpW ) / 2

      lAlpha      := HasAlpha( hBmp )

      if lAlpha .or. ! oCol:lBmpTransparent
         if nBmpW != nBmpWidth( hBmp ) .or. nBmpH != nBmpHeight( hBmp )
            hBmpO    := hBmp
            hBmp     := ResizeImg( hBmpO, nBmpW, nBmpH )
            DeleteObject( hBmpO )
         endif
      endif

      if lAlpha
         ABPaint( hDC, nBmpLeft, nBmpTop, hBmp, oCol:nAlphaLevel() )
      elseif oCol:lBmpTransparent
         nZeroClr  := GetZeroZeroClr( hDC, hBmp )
         nold     := SetBkColor( hDC, nRGB( 255, 255, 255 ) )
         TransBmp( hBmp, nBmpWidth( hBmp ), nBmpHeight( hBmp ),;
                   nZeroClr, hDC, nBmpLeft, nBmpTop, nBmpW, nBmpH )
         SetBkColor( hDC, nold )
      else
         DrawBitmap( hDC, hBmp, nBmpTop, nBmpLeft )
      endif
      DeleteObject( hBmp )
   endif

   DrawHorz( hDC, nTop + 120, nLeft - 4, nRight + 3, oBrw:hRowPen )
   FillRect( hDC, { nTop + 121, nLeft - 3, nBottom, nRight }, hBrush )

   if ! Empty( cData )
      nold   := SetBkColor( hDC, CLR_YELLOW )
      DrawTextEx( hDC, cFileNoPath( cData ), { nTop + 121, nLeft, nBottom, nRight }, ;
                  DT_CENTER + DT_VCENTER )
      SetBkColor( hDC, nold )
   endif

   DeleteObject( hBrush )

return nil

//----------------------------------------------------------------------------//

static function GetZeroZeroClr( hDC, hBmp )

    local hDCMem, hOldBmp, nZeroZeroClr

    hDCMem = CreateCompatibleDC( hDC )
    hOldBmp = SelectObject( hDCMem, hBmp )
    nZeroZeroClr = GetPixel( hDCMem,0,0)
    SelectObject( hDCMem, hOldBmp )
    DeleteDC( hDCMem )

return nZerozeroClr
 

[ukoenig]

Mr. Rao,

Thank You very much.
With these changes, it works fine now.
( I changed the Title of the Post for better understanding )

Testing different Images :


I will create a nice Viewer with :
Image-preview from any Directory, Grid-size-change, Export, Image-type-filter ...

The Download-link ( as soon it will be finished ), I will add to this Post.

Changing the cell-size at Runtime works fine.
Maybe I will adjust the Font-size and counting the possible Columns in Relation to Browser-size as well :
( Cellsize 60 = 12 visible Columns, Cellzisze 140 = 5 visible Columns )




Best Regards
Uwe

[Silvio]

uwe how you make dialog round ?

[Daniel Garcia-Gil]

Silvio


i think it's a Title, not a dialog

[ukoenig]

Daniel, Silvio

because of a User-question about a special Screen-design,
I got the Idea, to work with Screen-templates.
That makes it possible, to get a complete unusual Look.

Here is a Sample :

The used Template :
( saves some work, because can be used a few Times only changing the Controls )
You can use < PIXELFORMER > to create special Templates.



Next, placing different Controls on a defined Template-area ( only 1 Dialog )



Load the Template :

DEFINE IMAGE oTmp FILENAME c_Path + "\bitmaps\Template1.jpg"

DEFINE DIALOG oDlg1 FROM 0, 0 TO nScrheight - 38, nScrwidth - 7 PIXEL TRANSPARENT ;
STYLE WS_POPUP | WS_VISIBLE | WS_DLGFRAME // | WS_THICKFRAME
oBrush1 := TBrush():new( ,,,, ResizeBmp( oTmp:hBitmap, nScrwidth, nScrheight - 50, .T. ) )
oDlg1:Setbrush( oBrush1 )
oTmp:End()

Another Template with a second Dialog ( NOWAIT ), scrolling different VTitles-styles :



Best Regards
Uwe