Dic 282021
 

En esta ocasión hay tres formas de crear un Knob o control de perilla, los muy conocidos en el ambiente de audio; digo tres formas porque el primer control de usuario lo dibuja todo mediante métodos gráficos con el apoyo de la clase ClsNeumorphism. El segundo utiliza tiras de imágenes las cuales contienen fotogramas rotados porcentualmente, quienes diseñan estas imágenes toman en cuenta el movimiento de la sombra, haciendo una simulación en 3D de la perilla en su rotación. Por último se encuentra otro ejemplo empleando el usercontrol Labelplus donde ponemos una imagen de una perilla que hallamos descargado de internet o diseñado nosotros, y otro Labelplus por encima de este con la imagen de la flecha la cual se rotará según el ángulo que le asignemos al Labelplus.

También encontraran la clase clsSubClass la cual puede ser opcional, esta se utilizó para subclasificar el formulario y asi interceptar la rueda del mouse para rotar dichos controles, de todas formas lo más común es operarlos mediante el mouse con el botón izquierdo presionado subiendo o bajando el cursor.

ucKnob con métodos gráficos (Recomendado)

Knob1.png

.

.


.

ucKnobStrip y Labelplus

(las imágenes que subí en los ejemplos son de alta calidad y tamaño, queda en ustedes editar estas imágenes con la calidad/tamaño mas adecuado lograr el equilibrio entre diseño/memoria/procesador.)
Las tiras de imágenes fuero extraídas de JSAudioKnobs

Knob2.png Knob3.png
Sep 282021
 

Un nuevo UserControl u ocx (para quienes quieran compilarlo), tal como su nombre lo indica es una Grilla. Si bien ya hay algunas dando vuelta y muy buenas por cierto, en este caso intenté buscarle un lado más moderno, nunca había utilzado este control así que me fui basando en las diferentes opciones que hay por la web, tanto las de vb6 (LynxGrid, IGrid, VBFlexGrid) como las de uso web por ejemplo ComponentOne y DevExpress. Este control me llevó mucho tiempo ya que son muchas líneas de código, como siempre no he realizado ningún archivo de ayuda, pero dentro de los ejemplos encontrarán algunos ejemplos muy funcionales en tiempo real. Al ser un control con muchas opciones seguramente se me habrán escapado muchas cosas, las cuales podré ir agregando o corrigiendo si me lo hacen saber, algo que no pude hacer en esta grilla fue implementar la funcionalidad MergedCell (celdas combinadas), pero el resto creo está casi todo.

Un problema que encontré tarde fue que por cuestiones estéticas utilicé otro use sercontrol «ucScrollBar» tal como ya lo había hecho en el ucList, pero no había notado que si se cambia el nombre del proyecto el ucScrollBar pierde la referencia y se convierte en un PictureBox, para que esto no pase es necesario abrir el ucGridPlus con el notepad y cambiar «Proyecto1» por el nombre del proyecto en que lo vayan a emplear, de momento no encontré una mejor solución.

El control puede cargar imágenes de muchas formas y formatos tanto ColImgListAddImage y HeaderImgListAddImage pueden cargar la imagen desde array de bits, archivo, url, url base64, hbitmap, hIcon y stream; las imágenes pueden tratarse como vectores donde podemos asignarle el color según el forecolor de la celda o podemos poner imágenes comunes, también cuenta con dar una propiedad «radio» para dar forma circular o con puntas redondeadas.

En el primer ejemplo encontrarán algunos gráficos, Progresos y ranking que se muestran en cada fila, en esos ejemplos utilicé un módulo externo para usar un CustomDraw, esto con el conocimiento adecuando se pueden hacer infinitas cosas. No es parte de la grilla en si, de este modo es más fácil para hacer cosas a necesidad de cada uno.

En el caso de los controles, es lo mismo, no son parte de la grilla, el ucGridPlus es un contendor, donde podemos poner Combobox, Datepiker entre otros y con algunas propiedades de este podemos ubicar dichos controles sobre la celda simulando que forman parte de ella.

La grilla cuenta con la posibilidad de agregar eventos a las imágenes y texto de la celda, de esta forma se pueden lograr algunos lindos efectos como verán en los ejemplos.

Es necesario tener instalada la fuente «Segoe MDL2 Assets» en windows 10 ya está por defecto, esta se utilizo para algunos iconos.

Para la vercion compilada (OCX) utilice el control de usuario UniTextBox para que acepte caracteres unicodes en modo de edición.

Para cerrar quiero aclarar que esto por momento es algo así como una beta y hasta que no se use y se encuentren errores no los podré detectar, sé que muchas cosas me quedaron en el tintero pero por ahora se me agotó la energía.

A continuación una tabla de propiedades, Rutinas y funciones del ucGridPlus

ucGridPlus0.png ucGridPlus2.png ucGridPlus3.png ucGridPlus5.png ucGridPlus6.png ucGridPlus9.png ucGridPlus11.png ucGridPlus12.png

A continuación una tabla de sus propiedades.

AllowColumnDrag ColLabelsEvents HeaderLinesVerticalWidth
AllowColumnSort ColLeft HeaderTextAlign
AllowEdit ColMinWidth InsertRow
AutoHeightAllRows ColMoveTo LastRowIsFooter
AutoHeightRow ColRef LinesHorizontalColor
AutoWidthAllColumns ColsCount LinesHorizontalWidth
AutoWidthColumn ColSort LinesVerticalColor
BackColor ColSortOrder LinesVerticalWidth
BackColorAlt ColTag ParentBackColor
BorderColor ColTextHidde Redraw
BorderRadius ColumnsAutoFit RowAlign
BorderVisible ColumnText RowBackColor
CellAlign ColUserResizeLocked RowChecked
CellBackColor ColWidth RowDelete
CellEditionLocked ColWordBreak RowFont
CellFont CurCol RowForeColor
CellForeColor CurRow RowHeight
CellImageIndex EnsureCellVisible RowHidden
CellStartEdit FillFromRS RowIdent
CellTag FixedColumns RowIsFullRow
CellValue FixedRows RowIsGroup
CellWordBreak Font RowMoveTo
CheckStyle GetCellRect RowRef
ChrW2 GetHotCell RowsBackColor
Clear GetSelectionRange RowsBackColorAlt
ColFont GetWindowsDPI RowsCount
ColForeColor GroupByColumn RowSelectorBkColor
ColFormat GroupColapse RowSelectorWidth
ColHeaderForeColor GroupExpand RowTag
ColHeaderImgIndex HeaderBackColor RowWordBreak
ColHidden HeaderFont ScrollBarStyle
ColImageListCount HeaderHeight SelectionColor
ColImagesEvents HeaderImageAlign SelectionMode
ColImgAlign HeaderImgListAddImage SetCurCell
ColImgListAddImage HeaderImgListClear SetMargin
ColImgListClear HeaderImgListCount SetSelectionRange
ColImgListHeight HeaderImgListHeight ShowHotRow
ColImgListRemoveImage HeaderImgListRemoveImage Sort
ColImgListWidth HeaderImgListWidth SwapCol
ColImgMonocrome HeaderInitImgList SwapRow
ColInitImgList HeaderLinesHorizontalWidth UnGroup

Descargar UserControl y Ejemplos

Descargar OCX


Historial de cambios

Continue reading »
Abr 292020
 

Esta es una versión de este control el cual carecía de la barra de progreso para mostrar un porcentaje era más bien de esos que sólo giran. En esta versión se puede hacer ambas cosas, pero está más abocada a mostrar el progreso, prácticamente con un poco de ingenio se pueden lograr todos los diseños que se ven por la web de este tipo de controles tal como se muestra en la primer imágen; la segunda imágen es la página de propiedades del usercontrol, este sirve sólo para formar una paleta degradada de colores, donde podemos seleccionar y armar nuestra paleta a gusto. el control cuenta con muchas propiedades por lo que es necesario que metan mano y jueguen con éste para aprender para qué sirve cada una, yo no tengo ganas de hacer un archivo de ayuda :), pero mirando los ejemplos es fácil darse cuenta para qué sirve cada una.

ucProgressCircular2020.png
ucProgressCircular2020.png

21/09/21 Actualizado, se corrigió un error en la pagina de propiedades, al cargar el control en otro proyecto fallaba la el método de obtener el nombre del proyecto. Gracias Eduardo por la función GetProjectName

May 052013
 

Este es un OCX  llamado ImageWebSearch.ocx que sirve para buscar imágenes en la web, es algo similar al CommonDialog pero en vez de seleccionar un archivo en disco, lo seleccionamos de la web, luego está en ustedes manipular la url de la imágen obtenida. El OCX cuenta con dos motores de búsqueda el de Google y Devianart y tiene casi la totalidad de sus filtros, es totalmente asíncrono, por lo que no cuelga la aplicación al realizar peticiones, esto es algo importante porque al bajar el scroll de la lista, automáticamente va cargando nuevas búsquedas, osea va paginando el Listview con el scroll vertical (exactamente como lo hace Google Facebook etc.)

Dentro de la carpeta de descarga está el código de fuente, opté por compilarlo en OCX porque eran varios módulos,  formularios, controles de usuario y ademas un archivo de recurso exclusivo, por lo que compilado es mas fácil de utilizar.

Un punto en contra es que para la búsqueda utiliza los AJAX de los motores antes mencionados, por lo tanto si estos llegaran a cambiar con el tiempo el ocx quedaría obsoleto. Otra cosa a tener en cuenta es que la aplicación que lo implemente debe utilizar los temas de windows, de lo contrario el borde de las imágenes no se  mostrara correctamente.

Me quedaron algunas cosas que me hubiera gustado implementar, por ejemplo modificar el filtro desde código, pero al ser tantos me dió pereza  así que dejo en manos de ustedes si lo quieren hacer.

Requerimientos Windows XP y posteriores (Aunque no lo probé en XP, después edito.)

CtrlImageWebSearch.png

CtrlImageWebSearch2.png