السلام عليكم و رحمة الله تعالى و بركاته , هل يمكن تحويل تصاميم ويب إلى تطبيقات أندرويد !
سؤال : هل من الممكن تحويل (html,css,js) إلى تطبيق أندرويد (apk) , وكيف ذلك ؟
<!DOCTYPE html>
<html lang="ar">
<head>
<meta charset="UTF-8">
<title>HTML Playground</title>
<style>
body {
font-family: Arial;
background: #1e1e1e;
color: white;
display: flex;
justify-content: space-around;
align-items: center;
height: 100vh;
margin: 0;
}
textarea {
width: 45%;
height: 90%;
background: #111;
color: #0f0;
padding: 10px;
border: none;
font-size: 14px;
resize: none;
}
.phone {
width: 300px;
height: 550px;
border: 10px solid #333;
border-radius: 30px;
background: white;
overflow: hidden;
box-shadow: 0 0 20px black;
}
iframe {
width: 100%;
height: 100%;
border: none;
}
.container {
display: flex;
width: 100%;
height: 100%;
justify-content: space-around;
align-items: center;
}
</style>
</head>
<body>
<div class="container">
<!-- مكان كتابة الكود -->
<textarea id="code" placeholder="اكتب كود HTML هنا...">
<h1 style="text-align:center;">مرحبا 👋</h1>
<p style="color:blue; text-align:center;">جرب تكتب كود HTML هنا</p>
</textarea>
<!-- شاشة الهاتف -->
<div class="phone">
<iframe id="preview"></iframe>
</div>
</div>
<script>
const codeArea = document.getElementById("code");
const preview = document.getElementById("preview");
function updatePreview() {
preview.srcdoc = codeArea.value;
}
codeArea.addEventListener("input", updatePreview);
// عرض أولي
updatePreview();
</script>
</body>
</html>
التعليقات