اي فون وuiwebview الموارد المحلية باستخدام جافا سكريبت و التعامل مع onorientationChange

StackOverflow https://stackoverflow.com/questions/843820

  •  20-08-2019
  •  | 
  •  

سؤال

أحاول server HTML جافا سكريبت و CSS المحتوى من اي فون التطبيق الموارد المحلية و أنا أواجه مشكلة في التعامل مع onOrientationChange الأحداث الخارجية بما في ذلك جافا سكريبت.

لا يبدو أن تكون قادرة على الرابط في CSS بشكل صحيح ولكن ليس جافا سكريبت.أحاول استخدام المثال التالي من التعامل مع onOrientationChange (كيفية بناء اي فون الموقع) ولكن أنا تخدم صفحة الويب من التطبيق NSBundle mainBundle.

حاولت ربط وظيفة جافا سكريبت إلى الجسم.onorientationchange إلى النافذة.onorientationchange ولكن لا يعمل عند من وuiwebview محليا (أو بعد) ، لكنه يعمل إذا أنا باستخدام اي فون سفاري.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>How to build an iPhone website</title>

    <meta name="author" content="will" />
    <meta name="copyright" content="copyright 2008 www.engageinteractive.co.uk" />
    <meta name="description" content="Welcome to engege interactive on the iPhone!" />
    <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;">
    <link rel="apple-touch-icon" href="images/template/engage.png"/>

    <style type="text/css">
        @import url("iphone.css");
    </style>
    <!--
    <script type="text/javascript" src="orientation.js"></script>
    -->
    <script type="text/javascript">


function updateOrientation(){
    try  {
        var contentType = "show_normal";
        switch(window.orientation){
            case 0:
                contentType = "show_normal";
                break;

            case -90:
                contentType = "show_right";
                break;

            case 90:
                contentType = "show_left";
                break;

            case 180:
                contentType = "show_flipped";
                break;
        }

        document.getElementById("page_wrapper").setAttribute("class", contentType);
        //alert('ORIENTATION: ' + contentType);
    }
    catch(e) {
        alert('ERROR:' + e.message);
    }
} 

window.onload = function initialLoad(){
    try {
        loaded();
        updateOrientation();
    }
    catch(e) {
        alert('ERROR:' + e.message);
    }
}

        function loaded() {
            document.getElementById("page_wrapper").style.visibility = "visible";

        }


    </script>

</head>

<body onorientationchange="updateOrientation();">

    <div id="page_wrapper">
        <h1>Engage Interactive</h1>
        <div id="content_left">
            <p>You are now holding your phone to the left</p>
        </div>
        <div id="content_right">
            <p>You are now holding your phone to the right</p>
        </div>
        <div id="content_normal">
            <p>You are now holding your phone upright</p>
        </div>
        <div id="content_flipped">
            <p>This doesn't work yet, but there is a chance apple will enable it at some point, so I've put it in anyway. You would be holding your phone upside down if it did work.</p>
        </div>
    </div>

</body>
</html>
هل كانت مفيدة؟

المحلول

الجواب يمكن أن تتبع من تحذير كنت الحصول على كسكودي:

تحذير:لا حكم لمعالجة ملف '$(PROJECT_DIR)/html/orientation.js' من نوع المصدرية.جافا سكريبت العمارة i386

كسكودي إعداد *.شبيبة جافا سكريبت بعض نوع من التعليمات البرمجية المصدر في حاجة إلى تجميعها في التطبيق عندما أردت إدراجه كمورد لذا حلها عن طريق القيام 2 الأشياء.

  1. حدد .ملف js و في "التفاصيل" عرض إلغاء بولس عمود مشيرا إلى أنه يتم ترجمة التعليمات البرمجية
  2. في "المجموعات والملفات" عرض توسيع "الأهداف" شجرة وتوسيع نطاق التطبيق ثم انتقل إلى "نسخ حزمة الموارد" واسحب *.js الملفات إلى ذلك

أبل ديف المنتديات وقد نشر الحل:

ويبدو أن تحصل على بت إن "كسكودي يعتقد ذلك .شبيبة الأمور أن تجمع" الميزة.أساسا ، كسكودي يعتقد أن السيناريو يجب أن بطريقة ما يتم تشغيل أو برمجيا ، لذلك علامات على أنها جزء من التعليمات البرمجية المصدر.المصدر رمز بالطبع لا يتم نسخ إلى الموارد.

لذلك تحتاج إلى أمرين - حدد على .js الملفات في المشروع الخاص بك ، وتحويل خارج المربع الذي يشير إلى أن يتم ترجمة (عن "بولس" العمود).إذا كنت لا تفعل هذا, سوف الحصول على الإنذار في بناء سجل عن كونه غير قادر على تجميع الملف (الذي يجب أن يكون أول تحذير - دائما في محاولة لمعرفة و و تصحيح أي تحذير تظهر في البناء الخاص بك).

ثم قم بسحبه وإفلاته في الهدف "نسخ حزمة الموارد".

نصائح أخرى

وإجابة لمشكلة بلدكم الثاني من معالج onorientationchange لا يطلق عليها في UIWebView:

ولقد لاحظت أن الخاصية window.orientation لا يعمل بشكل صحيح ومعالج window.onorientationchange لا الحصول على استدعاء. معظم التطبيقات تعاني هذه المشكلة. وهذا يمكن أن تكون ثابتة عن طريق تعيين الخاصية window.orientation والدعوة window.onorientationchange في طريقة willRotateToInterfaceOrientation وحدة تحكم العرض التي تحتوي UIWebView الخاص بك:

- (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration
{
    switch (toInterfaceOrientation)
    {
        case UIDeviceOrientationPortrait:
            [webView stringByEvaluatingJavaScriptFromString:@"window.__defineGetter__('orientation',function(){return 0;});window.onorientationchange();"];
            break;
        case UIDeviceOrientationLandscapeLeft:
            [webView stringByEvaluatingJavaScriptFromString:@"window.__defineGetter__('orientation',function(){return 90;});window.onorientationchange();"];
            break;
        case UIDeviceOrientationLandscapeRight:
            [webView stringByEvaluatingJavaScriptFromString:@"window.__defineGetter__('orientation',function(){return -90;});window.onorientationchange();"];
            break;
        case UIDeviceOrientationPortraitUpsideDown:
            [webView stringByEvaluatingJavaScriptFromString:@"window.__defineGetter__('orientation',function(){return 180;});window.onorientationchange();"];
            break;
        default:
            break;
    }
}

فمن الأفضل استخدام

  • (الفراغ)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation

منذ سفاري هو فعلا يدعو orientationChange بعد عرض استدارة.

كان هذا مهما بالنسبة لي لأنني في حاجة إلى تغيير بلدي HTML5 اللوحات بعد الصفحة قد استدارة عرفت كيف كبيرة هو الحاوية.

ولقد وجدت بعض المعلومات الإضافية لاستخدام UIWebView مع الموارد المحلية.

وأنا جمعت معا في بلوق قصيرة. إذا كان شخص ما مهتم هناك مثال العمل التي يمكن تنزيلها.

http://mentormate.com/blog/ اي فون-uiwebview من الدرجة-محلي-CSS-جافا سكريبت الموارد /

ولقد وجدت دائرة الرقابة الداخلية 4.2 لا يدعم خاصية window.orientation في UIWebView، في حين أنها تعمل في رحلات السفاري المحمول ... لذلك، فإن الطريقة الوحيدة لقد وجدت من أجل أن أجعل JS تتفاعل مع التغيرات التوجه هو جعل هدفي-ج كود دعوة وظيفة جافا سكريبت المحددة في صفحة ويب UIWebView المعروضة حاليا. وفيما يلي نموذج التعليمات البرمجية، تجاوز أسلوب didRotateFromInterfaceOrientation ViewController ل:

- (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation {
    [webView stringByEvaluatingJavaScriptFromString:
          [NSString stringWithFormat:@"didRotateTo('%@')", 
            [self currentOrientationAsString]]];
}
- (NSString*) currentOrientationAsString {
    switch([[UIDevice currentDevice] orientation]) {
        case UIDeviceOrientationLandscapeLeft:
        case UIDeviceOrientationLandscapeRight:
            return @"landscape";
    }
    return @"portrait"; // assuming portrait is default
}

لديك لتحديد وظيفة جافا سكريبت على النحو التالي:

function didRotateTo(ori) {
  if (ori=="portrait") {
    // ... do something
  } else {
    // ... do something else
  }
}

واستمتع! :)

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top