본문 바로가기

D.evelop/MarkUp7

[XAML] Label 컨트롤 CefSharp https://cefsharp.github.io/ CefSharp : Chromium Embedded Framework(CEF)를 기반으로하는 웹 브라우저 컨트롤 HTML5, JS, CSS3 및 PDF 지원 XAML 확장 응용 프로그램 마크업 언어 (Extensible Application Markup Language) https://docs.microsoft.com/ko-kr/dotnet/desktop/wpf/xaml/?view=netdesktop-6.0 Label 컨트롤 관련 컨트롤에 focus 부여 key값으로 접근 가능 게임 런처 버전을 표시하는 텍스트 UI를 Label컨트롤이 적용된 소스로 전달 받았는데, 해당 텍스트가 출력되지 않았다. // 오류코드 // Label 컨트롤에 C.. 2023. 12. 14.
[HTML]오디오 재생 시 재생 중인 다른 오디오 정지 (HTML Audio DOM) 🔊 오디오 재생 let track = new Audio(); let flag = 0; // flag를 사용하여 재생 중인 오디오 있으면 정지 const playVoice = (audioSrc) =>{ track.src = audioSrc; console.log(track.paused) if(flag === 0){ flag = 1; playAudio(); }else{ flag = 0; stopAudio() } } const playAudio = () => { track.play(); track.paused = false iconAnimation("play"); } const stopAudio = () => { track.pause(); track.currentTime = 0; iconAnimation("s.. 2023. 12. 1.
[HTML]canvas 사용법 - 기본 (rect, path, arc) 1. html에 canvas 요소 작성 2. js로 canvas를 세팅 function drawMyCanvas(){ let canvas = document.getElementById("myCanvas"); // 어떤 콘텐츠를 그릴 것인가 let ctx = canvas.getContext("2d"); // 캔버스 사이즈, 배경색 등 설정 canvas.width = 500; canvas.height = 500; canvas.style.backgroundColor = "lightyellow" } 1. 사각형 메서드 ctx.strokeRect(x, y, w, h); ctx.fillRect(x, y, w, h); ctx.clearRect(x, y, w, h); See the Pen canvas - basic re.. 2023. 5. 27.
[HTML] redirect <meta http-equiv="refresh"/>로 해결한 사례 일하면서 알게된 것들을 기록합니다. 📝 언젠간 퍼즐이 맞춰지겠죠. [HTML] a태그 link와 onclick을 통한 링크 이동 이렇게 1차 조건을 해결했지만 ✅ 또 다른 이슈가 있었으니. https://kangdanne.tistory.com?post=10101010 위와 같은 query string 형식의 url이 전달 될 때 오류가 나는 현상. 인코딩의 문제인가 싶어, 인코딩/디코딩 등 어떤 방식으로 변환하여 전달해도 소용이 없었다. Cefsharp를 통하면 query string 형식의 url은 동작되지 않는 이슈가 있다고 한다. 그래서 무엇을 전달되게 할까? 가 아닌, 어떻게 실행되게 할까?로 초점을 옮겼다. 📍과장님의 아이디어 1. C#에서 '브라우저 실행("explorer.exe") > 해당 .. 2022. 6. 15.
[HTML] a태그 link와 onclick을 통한 링크 이동 (with C#) 일하면서 알게된 것들을 기록합니다. 📝 언젠간 퍼즐이 맞춰지겠죠. ✅ 이슈 사항 유저의 로컬 PC에 설치될 런처에서 연결될 메뉴 링크들이 모두 외부 브라우저를 사용해 열려야했다. go blog 쉽지 뭐. 하고 슥슥 작업을 했으나 생각치도 못한 이슈발생🥲 우리의 런처는 PC에서 하나의 App 상태로 열리게 되는 C#으로 만들어진 프로그램이었다. 고로 이곳에서의 새 창은 "윈도우 창"이 되었다. (CefSharp) 해서 팀장님께 보고를 드리고 업무를 배정 받게 되었다. 유저의 브라우저가 열리고 해당 링크로 연결되는 것이 목표! 👇 요건 백엔드 개발자분이 작업한 것 (예시) ... 중략 ... public void OpenLink(string link) { System.Diagnostics.Process.St.. 2022. 6. 15.
video태그 - 자동 재생 autoplay에 대한 방법과 생각 페이지에 접속함과 동시에 '영상이 자동재생'되게 해달라는 요청을 받았습니다. 'autoplay넣으면 됐던거 같은데, 모바일에서는 자동재생 안됐던 것같은데?'등등의 기억을 더듬어 코드를 수정! 했으나 실패하여 0부터 다시 다 찾아봐야만했던 슬픈 이야기. [처음 전달 받았던 코드의 ux flow] 1. 재생 버튼을 클릭하면 2. 영상이 담긴 레이어 팝업이 뜨면서 3. 해당 영상이 자동 재생된다. [요청 사항] 1. 페이지 접속 시 메인화면 상단의 영상 자동 재생 2. 영상의 소리도 재생 [결론] 1. 자동 재생 시킴 2. 구글 정책 설명 후 소리 muted로 타협 1. 자동 재생 되지 않은 사례 https://developer.chrome.com/blog/autoplay/ Autoplay policy in .. 2022. 3. 15.
유튜브 매개변수 - 영상 자동 재생, 연속재생, 컨트롤러 숨김 등 1. 페이지 로드 시 유튜브영상 자동 재생 방법 iframe의 src 링크 뒤에 ?amp;autoplay=1삽입 (정지=0, 재생=1 이며 기본값은 0) * 스마트폰, 태플릿 등 모바일 기기에서는 영상재생 시 데이터가 소모되기 때문에 기기 설정에 따라 자동영상 재생에 제한이 있다고함. 2. 한 영상을 반복해서 재생하기 iframe의 src 링크 뒤에 ?amp;loop=1삽입 (정지=0, 재생=1 이며 기본값은 0) 3. 특정시간부터 재생 ! 동영상 퍼가기 기능에 "시작 시간"을 입력하면 자동으로 코드가 생성됨 iframe의 src 링크 뒤에 ?start=숫자(초)삽입 4. 컨트롤바 숨김 iframe의 src 링크 뒤에 ?controls=0삽입 (숨김 =0, 표시=1 이며 기본값은 1) 그 외 유튜브에서 .. 2020. 7. 14.

티스토리툴바