{"id":1021,"date":"2021-06-21T02:26:03","date_gmt":"2021-06-21T05:26:03","guid":{"rendered":"http:\/\/leandroascierto.com\/blog\/?p=1021"},"modified":"2021-08-05T17:50:55","modified_gmt":"2021-08-05T20:50:55","slug":"class-shadow","status":"publish","type":"post","link":"https:\/\/leandroascierto.com\/blog\/class-shadow\/","title":{"rendered":"Class Shadow"},"content":{"rendered":"\n

Como su nombre en ingl\u00e9s lo indica clase para sombras, un m\u00f3dulo que nos servir\u00e1 para implementar sombras a nuestro formulario y controles, esta clase fue realizada con fines para otro control que compartir\u00e9 m\u00e1s adelante, pero decid\u00ed publicarlos por separado para que sea m\u00e1s f\u00e1cil de entender el uso de cada uno. Como ver\u00e1n en la imagen, adem\u00e1s de la sombra da una forma redondeada a los controles y formularios, esto coincide justamente con la nueva interfaz de Windows 11, pero en realidad la idea es copiar a los dise\u00f1os que vemos en HTML y CSS con Bootstrap, si bien a primera vista parece lo que se hizo con el LabelPlus<\/a>, esto es algo diferente y mucho m\u00e1s r\u00e1pido para este prop\u00f3sito.<\/p>\n\n\n\n

T\u00e9cnicamente su funcionamiento se divide en dos: para ventanas hijas y ventanas padres. En el caso de las ventanas hijas crea otra ventana que copia el color de fondo de la ventana contenedora, dibuja la sombra, borde y la misma se sit\u00faa debajo del control que queremos aplicar dicho estilo. Si tuvi\u00e9ramos un fondo degradado o con una imagen el efecto quedar\u00eda mal ya que esta ventana no es transparente, s\u00f3lo simula serlo (si bien es posible hacerla transparente, es m\u00e1s costoso en memoria, por lo cual decid\u00ed dejarlo as\u00ed). En el caso de las ventas padres tambi\u00e9n se crea una ventana con el estilo WS_EX_LAYERED y contiene un DIB con la imagen de la sombra, bordes y se sit\u00faa por detr\u00e1s de la ventana en cuesti\u00f3n. En este \u00faltimo caso la ventana tiene transparencia.<\/p>\n\n\n\n

La funci\u00f3n principal que inicia todo es \u00abShowBorders\u00bb, su primer par\u00e1metro es el hwnd de la ventana a aplicar los bordes y sombras, el segundo par\u00e1metro boolean es si esta ventana es hija (control) o Padre(Formulario) .<\/p>\n\n\n\n

Trat\u00e9 de subclasificar lo menos posible, s\u00f3lo WM_PAINT en ventanas hijas y WM_MOVE en ventanas padres por lo que si se ocultara el control queda en mano del programador llamar a la funci\u00f3n \u00abHideBorders\u00bb para ocultar la sombra, lo mismo cuando se cambie el tama\u00f1o del control u otras, es necesario llamar a \u00abRefresh\u00bb. Mirando los ejemplos se podr\u00e1 entender mejor su funcionamiento, por el momento funcionar\u00e1 as\u00ed, m\u00e1s adelante de ser necesario har\u00e9 algunos cambios.<\/p>\n\n\n\n

\n\"ClsShadow1.png\"\n\"ClsShadow2.png\"\n<\/figure><\/div>\n\n\n\n
\n
\n\"\"<\/a>\n<\/figure>\n<\/div>\n\n\n\n

Actualizado: 05\/08\/2021 (correcci\u00f3n en algunas fallas de la sombra en ventanas padres)<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"

Como su nombre en ingl\u00e9s lo indica clase para sombras, un m\u00f3dulo que nos servir\u00e1 para implementar sombras a nuestro formulario y controles, esta clase fue realizada con fines para otro control que compartir\u00e9 m\u00e1s adelante, pero decid\u00ed publicarlos por separado para que sea m\u00e1s f\u00e1cil de entender el uso de cada uno. Como ver\u00e1n […]<\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[29],"tags":[185,184,23,183],"class_list":["post-1021","post","type-post","status-publish","format-standard","hentry","category-modulos","tag-bordes","tag-shadow","tag-skin","tag-sombras","category-29-id","post-seq-1","post-parity-odd","meta-position-corners","fix"],"_links":{"self":[{"href":"https:\/\/leandroascierto.com\/blog\/wp-json\/wp\/v2\/posts\/1021","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=1021"}],"version-history":[{"count":3,"href":"https:\/\/leandroascierto.com\/blog\/wp-json\/wp\/v2\/posts\/1021\/revisions"}],"predecessor-version":[{"id":1035,"href":"https:\/\/leandroascierto.com\/blog\/wp-json\/wp\/v2\/posts\/1021\/revisions\/1035"}],"wp:attachment":[{"href":"https:\/\/leandroascierto.com\/blog\/wp-json\/wp\/v2\/media?parent=1021"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/leandroascierto.com\/blog\/wp-json\/wp\/v2\/categories?post=1021"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/leandroascierto.com\/blog\/wp-json\/wp\/v2\/tags?post=1021"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}