ცოტა ხნის წინ, ჩვენ ვსწავლობთ ვიდეოს გამოყენებას ანიმაციისა და ვიდეოს გამოყენების შესახებ, sprite ანიმაციის ნაცვლად. ამ ტიპის ვიდეოს ინტერაქტიულ ვიდეოს ვუწოდებთ.
ტრადიციული სპრიტი ანიმაცია: დიდი დისკის სივრცე, ნელი ჩამოტვირთვა, განსაკუთრებით ონლაინ დაკვრა, ნელა იქნება
ძალიან ბევრი ფაილი, ძალიან ბევრი http მოთხოვნა ინტერნეტში თამაშის დროს, გამოიწვევს ნელ რეაგირებას ან არანორმალურ ქცევას. ამიტომ, საჭიროა გადაუდებელი ტექნოლოგიის შემუშავება, რათა შეიცვალოს სპრეი ანიმაცია ვიდეოთი. ამ ტიპის ვიდეოს ინტერაქტიულ ვიდეოს ვუწოდებთ
ტრადიციული ვიდეოს პრობლემები:
1. თამაში მხოლოდ კვადრატული ფორმის ადგილას შეიძლება
2. iPad– ის ქვეშ, ეს არის ფანჯარა სათამაშოდ, ხოლო iPhone– ის ქვეშ, მისი გაშვება მხოლოდ მთელ ეკრანზეა შესაძლებელი.
3. თამაშის დროს ის აუცილებლად გამოჩნდება წინა პლანზე
ინტერაქტიულ ვიდეოს აქვს შემდეგი მახასიათებლები:
IPhone- ის ქვეშ, მთელ ეკრანზე დაკვრა არ არის საჭირო, მისი დაკვრა შეიძლება ერთ სფეროში
ინტერაქტიული ვიდეო შეიძლება გამოჩნდეს ჩვეულებრივი გრაფიკული ობიექტების ქვემოთ
ინტერაქტიულ ვიდეოს შეიძლება ჰქონდეს ნიღაბი, რომ ვიდეოს ფონი წაიშალოს და ვიდეო და ჩვეულებრივი გრაფიკული ობიექტები იყოს ინტეგრირებული
რეზიუმე: ვიდეოს დასაყენებლად, ჩვენ მას ვაყენებთ როგორც ტრადიციულ ვიდეოს. ვიდეოებისთვის, რომელთა გამოყენება კონკრეტული მიზნებისთვის არის საჭირო, ჩვენ ვაყენებთ მათ, როგორც ინტერაქტიულ ვიდეოს. კვლევამ წინასწარი შედეგები გამოიღო. სხვათა შორის, იგი აჯამებს უახლოეს რამდენიმე წელიწადში მობილური H5– ის აუდიო და ვიდეო განვითარების პროცესში არსებულ პრობლემებს და გვთავაზობს საკუთარ გადაწყვეტილებებს. გადახედეთ საბოლოო რეალურ ეფექტს: თავსებადია PC (> IE9), iphone, ipad, Android 5.0
მოაგვარეთ iPhone- ზე სახელმძღვანელო, ავტომატური და ფანჯრის შეცვლის პრობლემები და მას შეუძლია ძირითადად გამოყენებული იქნება რეალურ წარმოებაში. მარჯვნივ არის ორიგინალი ვიდეო mp4 ფაილი, მარცხნივ ვიდეო შეცვლის ანიმაციას და შემდეგ მხარს უჭერს ფონის ნიღბის ეფექტს, შეუძლია გამოავლინოს ბაზის რუკა და ინტერაქტიული ოპერაციების სერია.
H5 აუდიო
ყოველთვის, როდესაც აუდიო ობიექტი გადის ახალ აუდიოს საშუალებით, IOS– ზე ჩანს ახალი თემა.
გამოსავალი: ახალი აუდიო ობიექტი, სხვადასხვა აუდიო მისამართების ჩანაცვლებით, აღწევს მიზანს, არ გახსნას მეტი თემა.
Android- ზე მხარდაჭერა არ არის კარგი
გამოსავალი: Android- ის ქვედა ვერსიის პრობლემა არ მოგვარებულა. საერთოდ, შერეული განვითარება შეიძლება გაუმკლავდეს ძირითადი ინტერფეისის რეგულირებით, მაგალითად, phonegap
Iphone- ზე ავტომატურად დაკვრა შეუძლებელია
გამოსავალი: iphone- ზე ავტომატური დაკვრა არის პროცესი, როდესაც IOS შეიქმნა. როგორც ჩანს, ეს ხელს უშლის საგზაო მოძრაობის ავტომატურ ქურდობას.
მარტივად რომ ვთქვათ, ეს უნდა მოხდეს ხელით, მომხმარებლის სიმულაციით, ამიტომ თავიდანვე უნდა დარეკოთ კოდის ეს ნაწილი:
დააკოპირე კოდი
// შეასწორეთ პრობლემა, რომ ios ბრაუზერს ავტომატურად არ შეუძლია აუდიოს დაკვრა. ჩატვირთვისას შექმენით ახალი აუდიო და შეცვალეთ src მისი გამოყენებისას.
Xut.fix = Xut.fix || {};
თუ (Xut.plat.isBrowser && Xut.plat.isIOS) {
var არის აუდიო = ყალბი
var fixaudio = ფუნქცია () {
თუ (! isAudio) {
isAudio = მართალია;
Xut.fix.audio = ახალი აუდიო ();
document.removeEventListener ('touchstart', fixaudio, false);
}
};
document.addEventListener ('touchstart', fixaudio, false);
}
დააკოპირეთ ზემოთ მოცემული კოდი
თუ ასეთ კოდს დააკავშირებთ კორპუსს: შექმენით აუდიო ობიექტი ხელით გააქტიურებით და შემდეგ შეინახეთ გლობალურში
როდესაც გამოიყენება შემდეგნაირად:
დააკოპირე კოდი
// თუ იყენებთ Xut.fix.audio- ს, რომ მიუთითოთ src ios ბრაუზერისთვის, ინიციალიზაციისთვის მიმართეთ app.js
თუ (Xut.fix.audio) {
აუდიო
=
Xut.fix.audio;
audio.src = url;
} Else {
აუდიო = ახალი აუდიო (url);
}
audio.autoplay = მართალია;
აუდიო. თამაში ();
უბრალოდ შეცვალეთ აუდიო ობიექტი. მარტივად რომ ვთქვათ, ის უნდა იყოს მომხმარებლის ტრიგერის მიერ შექმნილი ობიექტი, რომ ითამაშოს.
H5 ვიდეო აუდიო
ვიდეო ტეგები შეიძლება იშვიათად იქნას გამოყენებული მობილურ ტერმინალზე, Android- ის მხარდაჭერა ძალიან ცუდია, ვიზუალურად 5.0 უკეთესია. IPhone- ზე ძველი პრობლემის ავტომატურად დაკვრა შეუძლებელია (დაზოგე მონაცემები, დაზოგე შენი და !!!), ხოლო ნაგულისხმევია სრულ ეკრანზე კონტროლის თამაში. დიდი ხნის განმავლობაში უგულებელვყოფდი ამ ვიდეოს დამუშავებას. Android იყენებს ქვედა ფენას, iPhone პირდაპირ იყენებს VideoJS- ს, ჩაშენებულ ფლეშსა და h5 შეცვლას, ფლეშს ასევე აქვს მხარდაჭერის პრობლემები. ცოტა ხნის წინ, პატრონს ჰქონდა მოთხოვნა. ჩვენ ძალიან ბევრი ანიმაცია გამოვიყენეთ, ყველა მათგანი იყო კომბინირებული მარშრუტების ანიმაციები, ასობით მეგაბაიტიდან ასამდე მეგაბაიტიდან დაწყებული ერთი აპის ქვეშ, ასე რომ, სურათების შეკუმშვის გადაჭრის გადაჭრის აუცილებლობაა. საბოლოო გამოსავალია ვიდეოს გამოყენება ანიმაციის ნაცვლად, რადგან ვიდეოს შეკუმშვის ტექნოლოგია მრავალი წლის განმავლობაში შემუშავებულია და ძალიან მომწიფებულია. ახლა ვიდეოს შეკუმშვის ტექნოლოგიას შეუძლია მარტივად გადააკეთოს 720P. მაღალი განმარტება ფილმები, შეკუმშული 10 მ / წთ, ან 160 კგ / წმ. სურათის თანმიმდევრობის ფაილის ზომა მინიმუმ რამდენჯერმე ნაკლებია. ამავდროულად, მოწყობილობების უმეტესობა მხარს უჭერს ვიდეოს აპარატურის დეკომპრესიას, ასე რომ, ვიდეოს დაკვრის პროცესორის მოხმარება ძალიან დაბალია, ბატარეის მოხმარებაც ძალიან დაბალია და დაკვრის სიჩქარეც სწრაფია. მარტივად მიიღწევა 25 კადრის მთლიანი ეკრანის დაკვრა.
გეგმა საბოლოოდ დასრულდა და გადასაჭრელი რამდენიმე პრობლემა აქ არის.
მთლიან ვიდეოს, მათ შორის ვიდეოს ზოგიერთ ობიექტს, შეუძლია რეაგირება მოახდინოს მომხმარებლის დაწკაპუნებაზე, სლაიდზე და სხვა ოპერაციებზე iPhone– ის ქვეშ, მისი დაკვრა შესაძლებელია ფანჯარაში, ფილტრის გაფილტვრა და მისი გამოყენება PNG სურათის მსგავსად. ვიდეო ცვლის ანიმაციას, შემდეგ კი მხარს უჭერს ფონის ნიღბის ეფექტს, რომელსაც შეუძლია გამოავლინოს ძირითადი სურათი, და ასევე გადაჭრის სახელმძღვანელოს, ავტომატური და არასრული ეკრანის პრობლემას.
iphone ფანჯარა
გამოსავალი: დააკავშიროთ დამუშავება ტილოს საშუალებით + ვიდეო ტეგები
პრინციპი: მიიღეთ ვიდეოს ორიგინალი ჩარჩო და ტილოების საშუალებით დახაზეთ გვერდზე
აქ პირდაპირ ვამაგრებ კოდის კოდს, ზოგადად იწერება კოდი, მაგრამ ხაზს უსვამს რამდენიმე მნიშვნელოვან წერტილს
http://iwearshorts.com/blog/inline-video-on-the-iphone/
http://stackoverflow.com/questions/3699552/html5-inline-video-on-iphone-vs-ipad-browser
ვიდეო ანიმაციის ნაცვლად
ეს ცოტა რთულია. ეს უნდა იყოს ინტერაქტიული და გადაიტანოს ტილო, რომ მიაღწიოს სურათის კონტროლის მიზანს. მე ჯერ არ დამიმთავრებია ყველაფრის დაწერა და კომპანიის ზოგადი საჭიროებები ამას არ ექნება. აქ მოცემულია მოკლე აღწერა, იგი ასევე დამუშავებულია ტილოთი + ვიდეოს საშუალებით, მაგრამ წინასწარი დამუშავების გასაკეთებლად საჭიროა შეფუთული ტილოს კონტეინერი. წინასწარი დამუშავების საშუალებით მიიღეთ თითოეული სურათის პიქსელი და თითოეული პიქსელის RBG მნიშვნელობის შეცვლით, მას შეუძლია გაფილტროთ ფონი, ასე რომ შეიძლება გამოყენებულ იქნას PNG სურათის მსგავსად. მოგვიანებით დავწერ და გამოვაქვეყნებ
ჩვენი სხვა პროდუქტი:
