От известно време имах идеята да създам моето домашно табло, за да мога да управлявам устройствата си, включително тези две лампи, които имам в дома си. Но винаги съм запазвал тази идея за в бъдеще, най-вече защото обичам да правя красиви потребителски интерфейси и в момента, за да имате приятно изживяване, ви трябва нещо като angular, react или много javascript, което не ми харесва много.
Така че ако тръгнете по маршрута на приложение с една страница, трябва също да създадете уеб API, така че да може да се използва от административния панел. Това, което можете да видите, бързо става много досадна и дълга работа.
Но сега Blazor ни дойде на помощ, благодарение на своя двигател за изобразяване от страна на сървъра, който позволява изживяване на една страница благодарение на своя уеб сокет комуникацията, която потребителят не забелязва, промените се изобразяват от уеб сървъра. Дори за нас разработчиците моделът на разработка изглежда подобен, всъщност можете лесно да превключите от изобразяване от страна на сървъра към уеб асемблиране (но не можете да използвате сървърни библиотеки като EF Core или друг DB конектор).
Благодарение на сървъра странично изобразяване Мога да използвам библиотеки като YeelightAPI, за да откривам и включвам и изключвам осветлението в дома си.
Ето как изглежда панелът
Панелът в момента е много прост и включва/изключва и преименува устройството.
Кодът не е красив, но за нашите тестови цели ще свърши работа. Нека да разгледаме как се откриват устройствата.
Можете лесно да видите, че вътре в моя Index.cshtml директно извиквам DeviceLocator.Discover() вътре в OnInitAsync() и след това преминавам през тях, за да ги покажа като карти, трябваше да отделя изобразяването на всяка светлина на Blazor Component, за да мога да управлявам устройството и се заявява лесно.
Кодът за включване/изключване на лампата е на ToggleOnOff и с няколко помощни метода за повторно свързване към устройството и проверка на състоянието на устройството, като всичко това се прави с помощта на съществуващи библиотеки с уменията, които вече познавам от повече от 15 години C#.
Всъщност този малък потребителски интерфейс беше разработен за по-малко от два часа, за които вероятно бяха пропилени повече от 30 минути, защото можех да се свържа с моите yeelight устройства!!
След това открих, че трябва да активирате откриваемостта на мрежата от Yeelight Mobile App, както следва.
Изберете устройството, което искате да бъде откриваемо, след което, когато се отвори този екран, щракнете върху бутона долу вдясно.
Сега изберете бутона Lan Control в долната част.
Добре, сега сте добре и можете да продължите да играете с вашите устройства, използвайки Blazor и asp.net core :)
Ето моя примерен проект в github
