Amit Padhiyar - Saatody

RightEffect.cs Drag object using MouseLeftButtonDown, MouseLeftButtonUp and MouseMove. When we drag object using mouse and if object's any part is going outside parent panel then the parent panel margin automatically update and try to in that object. using System; using System.Windows; using System.Windows.Controls; using System.Windows.Shapes; using System.Windows.Media; using System.Windows.Input; namespace EffectFeatures { public class RightEffect : Border { public void Initialize() { try { Repaint(); Resize(); Event(); Refresh(); } catch (Exception e) { } } public void Repaint() { try { this.Background = new SolidColorBrush(Color.FromArgb(100, 255, 165, 0)); this.BorderBrush = new SolidColorBrush(Color.FromArgb(255, 255, 165, 0)); this.BorderTh...

RightEffectRow.cs Drag object using MouseLeftButtonDown, MouseLeftButtonUp and MouseMove. When we drag object using mouse and if object's any part is going outside parent panel then the parent panel margin automatically update and try to in that object. using System; using System.Windows; using System.Windows.Controls; using System.Windows.Shapes; using System.Windows.Media; using System.Windows.Input; using System.Collections.Generic; using System.Windows.Threading; namespace EffectFeatures { public class RightEffectRow : Grid { public RightEffect RE = new RightEffect(); public static UIElement UI = new UIElement(); public void Initialize() { try { this.Children.Clear(); Repaint(); Resize(); Event(); Refresh(); UI = this; this.Children.Add(RE); RE.Initialize(); } ...

RightEffectRowContainer.cs Drag object using MouseLeftButtonDown, MouseLeftButtonUp and MouseMove. When we drag object using mouse and if object's any part is going outside parent panel then the parent panel margin automatically update and try to in that object. using System; using System.Windows; using System.Windows.Controls; using System.Windows.Shapes; using System.Windows.Media; using System.Windows.Input; using System.Windows.Threading; namespace EffectFeatures { public class RightEffectRowContainer : Grid { public void Initialize() { try { this.Children.Clear(); Repaint(); Resize(); Event(); Refresh(); } catch (Exception e) { } } public void Repaint() { try { LinearGradientBrush gradientBrush = new LinearGradientBrush(Color.FromRgb(100, 0, 0), Color.FromRgb...

RightEffectControl.cs Drag object using MouseLeftButtonDown, MouseLeftButtonUp and MouseMove. When we drag object using mouse and if object's any part is going outside parent panel then the parent panel margin automatically update and try to in that object. using System; using System.Windows; using System.Windows.Controls; using System.Windows.Shapes; using System.Windows.Media; using System.Windows.Input; using System.Collections.Generic; namespace EffectFeatures { public class RightEffectControl { public RightEffectRowContainer RERC = new RightEffectRowContainer(); public List<RightEffectRow> RER = new List<RightEffectRow>(); private double Y = 0; private int Counter = 0; public void AddRow() { RightEffectRow _RER = new RightEffectRow(); _RER.HorizontalAlignment = HorizontalAlignment.Left; _RER.VerticalAlignment = VerticalAlignment.Top; _RER.Margin = new Thic...

MyColor.cs Drag object using MouseLeftButtonDown, MouseLeftButtonUp and MouseMove. When we drag object using mouse and if object's any part is going outside parent panel then the parent panel margin automatically update and try to in that object. using System.Windows.Media; namespace EffectFeatures { public class MyColor { public static Color[] Row = { Color.FromRgb(20, 15, 0), Color.FromRgb(20, 0, 15), Color.FromRgb(10, 0, 20), Color.FromRgb(0, 10, 20), Color.FromRgb(0, 20, 15), }; public static Color[] Effect = { Color.FromRgb(255, 165, 0), Color.FromRgb(255, 0, 165), Color.FromRgb(165, 0, 255), Color.FromRgb(0, 165, 255), Color.FromRgb(0, 255, 165), }; } } MainWindow.cs | Drag Object To Scroll In WPF C# | Amit Padhiyar | Saatody MyRowControl.cs | Drag Object To Scroll In WPF C# | Amit Padhiyar | Saatody MyRo...

MyRowTest.cs Drag object using MouseLeftButtonDown, MouseLeftButtonUp and MouseMove. When we drag object using mouse and if object's any part is going outside parent panel then the parent panel margin automatically update and try to in that object. using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Threading.Tasks; using System.Windows; using System.Windows.Controls; using System.Windows.Data; using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Imaging; using System.Windows.Navigation; using System.Windows.Shapes; using System.Windows.Threading; namespace EffectFeatures { public class MyRowTest : Grid { public static RightEffectControl REC = new RightEffectControl(); public void Initialize() { try { this.Children.Clear(); Repaint(); Resize(); Event(...

MyRowControl.cs Drag object using MouseLeftButtonDown, MouseLeftButtonUp and MouseMove. When we drag object using mouse and if object's any part is going outside parent panel then the parent panel margin automatically update and try to in that object. using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Threading.Tasks; using System.Windows; using System.Windows.Controls; using System.Windows.Data; using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Imaging; using System.Windows.Navigation; using System.Windows.Shapes; using System.Windows.Threading; namespace EffectFeatures { public class MyRowControl : Grid { private static Button AddRow = new Button(); public void Initialize() { try { this.Children.Clear(); Repaint(); Resize(); Event(); ...

MainWindow.cs Drag object using MouseLeftButtonDown, MouseLeftButtonUp and MouseMove. When we drag object using mouse and if object's any part is going outside parent panel then the parent panel margin automatically update and try to in that object. using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Threading.Tasks; using System.Windows; using System.Windows.Controls; using System.Windows.Data; using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Imaging; using System.Windows.Navigation; using System.Windows.Shapes; namespace EffectFeatures { public partial class MainWindow : Window { public static UIElement UI = new UIElement(); public MainWindow() { InitializeComponent(); UI = Container; MyRowControl MRC = new MyRowControl(); MRC.HorizontalAlignment = HorizontalAlignment.Center; ...

According to me, The below program is the best standard to define WPF custom UI. There is five core methods for making UI. Initialize() Repaint() Resize() Event() Refresh() using System; using System.Windows; using System.Windows.Controls; using System.Windows.Media; using System.Windows.Threading; namespace Saatody { public class MyGrid : Grid { #region Core public void Initialize() { try { this.Children.Clear(); Repaint(); Resize(); Event(); Refresh(); this.Children.Add(SomethingElse); SomethingElse.Initialize(); } catch (Exception e) { } } public void Repaint() { try { } catch (Exception e) { } } public void Resize() { try ...

I use 10 Grid Objects where i take 5 Grid objects as parents and other 5 Grid objects as children. Look at the WPF C# simple program which is below. using System; using System.Windows; using System.Windows.Controls; using System.Windows.Media; namespace Demo.Saatody { public class OverdrawProblem : Window { private static Grid Container = new Grid(); private static Grid Parent1 = new Grid(); private static Grid Parent2 = new Grid(); private static Grid Parent3 = new Grid(); private static Grid Parent4 = new Grid(); private static Grid Parent5 = new Grid(); private static Grid Child1 = new Grid(); private static Grid Child2 = new Grid(); private static Grid Child3 = new Grid(); private static Grid Child4 = new Grid(); private static Grid Child5 = new Grid(); public void Initialize() { try { this.Content = Container; ...

Shadow DOM is second most useful feature for web components after custom elements. It is useful for markup structure, style, and behavior hidden and separate from other code on the page. In short, It is known as encapsulation. Shadow DOM is supported by default in Firefox (63 and onwards), Chrome, Opera, and Safari. The new Chromium-based Edge (75 and onwards) supports it too; the old Edge didn't. The Shadow DOM is not new thing for browsers. Shadow DOM allows hidden DOM trees to be attached to elements in the regular DOM tree. This shadow DOM tree starts with a shadow root, underneath which can be attached to any elements you want, in the same way as the normal DOM. Shadow DOM Shadow host: The regular DOM node that the shadow DOM is attached to. Shadow tree: The DOM tree inside the shadow DOM. Shadow boundary: The place where the shadow DOM ends, and the regular DOM begins. Shadow root: The root node of the shadow tree. First we create simple custom element. ...

You can define several different callbacks inside a custom element's class definition, which fire at different points in the element's lifecycle. connectedCallback: Invoked each time the custom element is appended into a document-connected element. This will happen each time the node is moved, and may happen before the element's contents have been fully parsed. disconnectedCallback: Invoked each time the custom element is disconnected from the document's DOM. adoptedCallback: Invoked each time the custom element is moved to a new document. attributeChangedCallback: Invoked each time one of the custom element's attributes is added, removed, or changed. Which attributes to notice change for is specified in a static get observedAttributes method In Short... connectedCallback: Invoked when the custom element is first connected to the document's DOM. disconnectedCallback: Invoked when the custom element is disconnected from the document...

Define class with class name and outside of the define() function is the best way to create custom element. <script> class HelloMSG extends HTMLElement{ constructor(){ super(); console.log("constructor"); } } window.customElements.define("hello-msg",HelloMSG); </script> There is one thing that prove why i recommended to define HTML custom element like this. <script> const msg = new HelloMSG(); document.body.appendChild(msg); </script> For append my HTML custom element using JavaScript.

CustomElementRegistry The CustomElementRegistry interface provides methods for registering custom elements and querying registered elements. But, The CustomElementRegistry function, which is currently experimental (Expect behavior to change in the future). The CustomElementRegistry is available through the window.customElements property. Methods In my browser, The CustomElementRegistry can't work properly. So i will not use this property and i recommended window.customElements instead of CustomElementRegistry. CustomElementRegistry.define() CustomElementRegistry.get() CustomElementRegistry.upgrade() CustomElementRegistry.whenDefined() window.customElements The customElements read-only property of the Window interface returns a reference to the CustomElementRegistry object, which can be used to register new custom elements and get information about previously registered custom elements. How to check the window.customElements return CustomElementRegi...

Web Components are set of features or suite of different technologies that allowing to create, encapsulation and interoperability of reusable HTML custom elements. There are main three technologies to create Web Components. Custom Elements Shadow DOM HTML Templates Custom Elements A set of JavaScript APIs that allow you to define custom elements and their behaviour. There are two parts to Custom Elements: autonomous custom elements and customized built-in elements. Autonomous custom elements are HTML elements that are entirely separated from native HTML elements; they are essentially built from the bottom up using the Custom Elements API. Customized built-in elements are elements that are built upon native HTML elements to reuse their functionality. Shadow DOM A set of JavaScript APIs for attaching an encapsulated "shadow" DOM tree to an element. And shadow DOM is a functionality that allows the web browser to render DOM elements without putting them into t...

This article is all about read AJAX callback function. This callback function gives output in XML and JSON formats. This will also help us to make blogger widgets without blogger tags like <b:widget>. The callback function read blogger feeds using readJSON() and readXML() functions. Write entire program between <script> tag. <script> </script> Create callback function in AJAX function read(_url, _function){ var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function(){ if (this.readyState == 4 && this.status == 200){ _function(this); } }; xhttp.open('GET',_url,true); xhttp.send(); } Create callback function for JSON format function readJSON(_url, _function){ read(_url + "?alt=json", _function); } Create callback function for XML format function readXML(_url, _function){ read(_url ,_function); } Create function that write output in browser conso...

In this post, I am trying to create Blogger empty theme. So, This can help to make customize theme for Blogger. First, I will create Basic HTML Structure. HTML Basic Structure <!DOCTYPE html> <html> <head> </head> <body> </body> </html> This is simple structure. But still, This will give an error when we store it in Blogger theme editor. So what is the minimum requirement for creating empty theme? Put The XML Prolog At Top Of The Script It means Blogger theme markup is not in HTML but it is in XML format. It must come first in the document. <?xml version="1.0" encoding="UTF-8" ?> Put <b:skin> And <![CDATA[]]> In Head The <b:skin> is blogger API (Custome tag from Bloggger) that used for define CSS in your theme. While <![CDATA[]]> used for write data in between these strings includes data that could be interpreted as XML markup, but should not be. ...