{"id":1038,"date":"2021-09-28T01:36:57","date_gmt":"2021-09-28T04:36:57","guid":{"rendered":"http:\/\/leandroascierto.com\/blog\/?p=1038"},"modified":"2023-11-05T23:19:16","modified_gmt":"2023-11-06T02:19:16","slug":"gridplus","status":"publish","type":"post","link":"https:\/\/leandroascierto.com\/blog\/gridplus\/","title":{"rendered":"GridPlus"},"content":{"rendered":"\n

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\u00e9 buscarle un lado m\u00e1s moderno, nunca hab\u00eda utilzado este control as\u00ed 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<\/a> y DevExpress<\/a>. Este control me llev\u00f3 mucho tiempo ya que son muchas l\u00edneas de c\u00f3digo, como siempre no he realizado ning\u00fan archivo de ayuda, pero dentro de los ejemplos encontrar\u00e1n algunos ejemplos muy funcionales en tiempo real. Al ser un control con muchas opciones seguramente se me habr\u00e1n escapado muchas cosas, las cuales podr\u00e9 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\u00e1 casi todo.<\/p>\n\n\n\n

Un problema que encontr\u00e9 tarde fue que por cuestiones est\u00e9ticas utilic\u00e9 otro use sercontrol \u00abucScrollBar\u00bb tal como ya lo hab\u00eda hecho en el ucList, pero no hab\u00eda 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 \u00abProyecto1\u00bb por el nombre del proyecto en que lo vayan a emplear, de momento no encontr\u00e9 una mejor soluci\u00f3n. <\/p>\n\n\n\n

El control puede cargar im\u00e1genes 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\u00e1genes pueden tratarse como vectores donde podemos asignarle el color seg\u00fan el forecolor de la celda o podemos poner im\u00e1genes comunes, tambi\u00e9n cuenta con dar una propiedad \u00abradio\u00bb para dar forma circular o con puntas redondeadas.<\/p>\n\n\n\n

En el primer ejemplo encontrar\u00e1n algunos gr\u00e1ficos, Progresos y ranking que se muestran en cada fila, en esos ejemplos utilic\u00e9 un m\u00f3dulo 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\u00e1s f\u00e1cil para hacer cosas a necesidad de cada uno.<\/p>\n\n\n\n

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.<\/p>\n\n\n\n

La grilla cuenta con la posibilidad de agregar eventos a las im\u00e1genes y texto de la celda, de esta forma se pueden lograr algunos lindos efectos como ver\u00e1n en los ejemplos.<\/p>\n\n\n\n

Es necesario tener instalada la fuente \u00abSegoe MDL2 Assets\u00bb en windows 10 ya est\u00e1 por defecto, esta se utilizo para algunos iconos.<\/p>\n\n\n\n

Para la vercion compilada (OCX) utilice el control de usuario UniTextBox para que acepte caracteres unicodes en modo de edici\u00f3n.<\/p>\n\n\n\n

Para cerrar quiero aclarar que esto por momento es algo as\u00ed como una beta y hasta que no se use y se encuentren errores no los podr\u00e9 detectar, s\u00e9 que muchas cosas me quedaron en el tintero pero por ahora se me agot\u00f3 la energ\u00eda.<\/p>\n\n\n\n

Aqu\u00ed puedes ver la Documentaci\u00f3n del control<\/a><\/p>\n\n\n\n

\n\"ucGridPlus0.png\"\n\"ucGridPlus2.png\"\n\"ucGridPlus3.png\"\n\"ucGridPlus5.png\"\n\"ucGridPlus6.png\"\n\"ucGridPlus9.png\"\n\"ucGridPlus11.png\"\n\"ucGridPlus12.png\"\n<\/figure><\/div>\n\n\n\n

A continuaci\u00f3n una tabla de sus propiedades.<\/p>\n\n\n\n

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

VER DOCUMENTACION ONLINE <\/mark><\/a><\/strong><\/p>\nGracias Yvan por el aporte<\/strong><\/cite><\/blockquote>\n\n\n\n

Descargar UserControl y Ejemplos<\/strong> (Actualizado 08\/11\/2022)<\/p>\n\n\n\n

\n
\n\"\"<\/a>\n<\/figure>\n<\/div>\n\n\n\n

Descargar OCX <\/strong> (Actualizado 21\/01\/2022)<\/p>\n\n\n\n

\n
\n\"\"<\/a>\n<\/figure>\n<\/div>\n\n\n\n
\n\n\n\n

Historial de cambios<\/strong><\/p>\n\n\n\n\n\n\n\n

\n

29\/09\/21 V:1.0.1<\/strong>
Solucionado ordenamiento de columna, solo se realizara con el bot\u00f3n izquierdo, no se ordenar\u00e1 cuando la columna es arrastrada.
Solucionado cuando se cambiaba el tama\u00f1a de una fila, el scrollbar no mostraba las ultimas filas.
Solucionado error al ordenar columna con la grilla no sin filas.<\/p>\n\n\n\n

01\/10\/21 V:1.0.2 ‘Gracias Elihu!!<\/strong>
Solucionado Error visual si el valor del scroll era mayor al M\u00e1ximo, tambi\u00e9n se agrego una llamada directa dentro del Scroll que causaba un un retardo a causa del timerVB
La selecci\u00f3n ahora se puede realizar con el bot\u00f3n derecho, si se hace click derecho dentro del rango selecionado la selecci\u00f3n no se pierde, especial para un PopUpMenu.
Se agrego par\u00e1metros ‘Button’, ‘Shift’ en los eventos CellClick, LabelMouseDown, LabelMouseUp, ImgMouseDown, ImgMouseUp
se agrego la propiedad BorderWidth y se quito la propiedad BorderVisible, tambi\u00e9n se corrigi\u00f3 un error en el color del borde.
Se a\u00f1adi\u00f3 la propiedad ShowHotColumn (para resaltar las columna debajo del cursor)
En la versi\u00f3n OCX en el uniTextBox se corrigi\u00f3 detecci\u00f3n de las flechas del teclado (NO IPAO)<\/p>\n\n\n\n

11\/10\/2021 V:1.0.3<\/strong>
Se a\u00f1adieron varios cambios y arreglos, no recuerdos todos
Se a\u00f1adieron todas las propiedades y eventos referido a Drag & Drop
Se mejoro la lectura de im\u00e1genes para iconos y bitmaps de 32bits con canal alpha
Se mejoro la funci\u00f3n AutoWidthColumn
Se a\u00f1adieron las propiedades ColSort y ColSortOrder, para quienes tengan que ordenar las columnas por consultas SQL<\/p>\n\n\n\n

15\/11\/2021 V:1.0.4<\/strong>
Cambios a\u00f1adido por <\/a>jpbro<\/strong><\/a>, comportamiento en el cuadro de texto al mover las flechas del teclado, y agregado evento BeforeEdit (Gracias)<\/p>\n\n\n\n

30\/12\/2021 V:1.0.5<\/strong>
Se a\u00f1adi\u00f3 la propiedad CtrlEdit esta retorna el control TextBox de la grilla, con esto ya se puede manipular el TextBox a gusto e interceptar todos los eventos
Tambi\u00e9n se a\u00f1ado el evento KeyUp que se me hab\u00eda pasado por alto, y dos eventos mas EditKeyPress y EditKeyDown son los eventos disparados por el textbox de la grilla, de todas formas podemos declarar en el formulario Private WithEvents TxtGrid As TextBox y luego asignarle en el Form_Load() Set TxtGrid = ucGridPlus1.CtrlEdit as\u00ed recibiremos todos los eventos del textbox.<\/p>\n<\/div><\/div>\n\n\n\n

29\/01\/2022 V:1.0.6<\/strong>
A\u00f1adidas las propiedades ShowHotRow, HeaderTextWordBreak, GradientStyle, GetTopRow y GetVisibleRows<\/p>\n\n\n\n

<\/p>\n","protected":false},"excerpt":{"rendered":"

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\u00e9 buscarle un lado m\u00e1s moderno, nunca hab\u00eda utilzado este control as\u00ed que me fui basando en las diferentes opciones que hay […]<\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[26,116],"tags":[188,167],"class_list":["post-1038","post","type-post","status-publish","format-standard","hentry","category-controles-de-usuarios","category-ocx","tag-grid","tag-usercontrol","category-26-id","category-116-id","post-seq-1","post-parity-odd","meta-position-corners","fix"],"_links":{"self":[{"href":"https:\/\/leandroascierto.com\/blog\/wp-json\/wp\/v2\/posts\/1038","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/leandroascierto.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/leandroascierto.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/leandroascierto.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/leandroascierto.com\/blog\/wp-json\/wp\/v2\/comments?post=1038"}],"version-history":[{"count":30,"href":"https:\/\/leandroascierto.com\/blog\/wp-json\/wp\/v2\/posts\/1038\/revisions"}],"predecessor-version":[{"id":1346,"href":"https:\/\/leandroascierto.com\/blog\/wp-json\/wp\/v2\/posts\/1038\/revisions\/1346"}],"wp:attachment":[{"href":"https:\/\/leandroascierto.com\/blog\/wp-json\/wp\/v2\/media?parent=1038"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/leandroascierto.com\/blog\/wp-json\/wp\/v2\/categories?post=1038"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/leandroascierto.com\/blog\/wp-json\/wp\/v2\/tags?post=1038"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}