การสอนการพัฒนาบัญชีสาธารณะ WeChat: คู่มือเต็มรูปแบบสำหรับรูปภาพและข้อความ

บทนำและสรุปเนื้อหา

ผู้อ่านหลายคนบ่นว่า "Liu Feng ใช้ข้อความเป็นตัวอย่างเป็นตัวอย่างไม่เคยกล่าวถึงข้อความกราฟิกและไม่ทราบวิธีการใช้ข้อความกราฟิก" ฉันผิด ตอนแรกฉันคิดว่า API พื้นฐานถูกห่อหุ้มและกรอบงานถูกสร้างขึ้นจากนั้นให้ตัวอย่างของข้อความเพื่อใช้ อาจเป็นเพราะทักษะการวาดภาพของฉันแย่เกินไปแมวที่ฉันวาดไม่เหมือนแมว ...

บทความนี้ส่วนใหญ่แนะนำการใช้กราฟิกและข้อความในการพัฒนาบัญชีสาธารณะ WeChat รวมถึงการปรากฏตัวของกราฟิกและข้อความหลายรายการ ชื่อชื่อ "คู่มือทั้งหมดสู่รูปภาพและข้อความ" นี่ไม่ใช่ปาร์ตี้ชื่ออย่างแน่นอน มันคือการใช้โอกาสนี้เพื่อกำจัดปัญหาความกังวลและอุปสรรคที่เกี่ยวข้องกับรูปภาพและข้อความ

คำอธิบายของพารามิเตอร์หลักของกราฟิกและข้อความ

ผ่านคู่มืออินเตอร์เฟสข้อความ WeChat อย่างเป็นทางการคุณสามารถดูพารามิเตอร์ของกราฟิกและข้อความดังแสดงในรูปด้านล่าง:

จากภาพเราสามารถเรียนรู้ได้:

1. จำนวนกราฟิกและข้อความถูก จำกัด ไว้ที่ 10 ซึ่งเป็นค่าของข้อต่อในรูป (จำนวนกราฟิกและข้อความถูก จำกัด อยู่ภายใน 10)
2. สำหรับข้อความหลายกราฟิกภาพแรกของรูปภาพจะแสดงเป็นภาพขนาดใหญ่และภาพอื่น ๆ จะแสดงเป็นภาพเล็ก ๆ
3. ขนาดภาพที่แนะนำของภาพและข้อความแรกคือ 640*320 และขนาดภาพที่แนะนำของรูปภาพและข้อความอื่น ๆ คือ 80*80;

การแสดงออกที่หลากหลายของกราฟิกและข้อความ

ต่อไปนี้เป็นรหัสที่แสดงให้เห็นถึงการใช้งานกราฟิกและข้อความหลักห้ารูปแบบโดยตรง ซอร์สโค้ดมีดังนี้:

 แพ็คเกจ org.liufeng.course.service; นำเข้า java.util.arraylist; นำเข้า java.util.date; นำเข้า java.util.list; นำเข้า java.util.map นำเข้า javax.servlet.http.httpservletrequest; org.liufeng.course.message.resp.newsmessage; นำเข้า org.liufeng.course.message.resp.textmessage นำเข้า org.liufeng.course.util.messageutil;/** WeChat * * @param Request * @return */ ProcessRequest String สาธารณะ (คำขอ httpservletRequest) {String respmessage = null; ลอง {// XML คำขอการแยกวิเคราะห์ <String, String> requestMap = MessageUtil.Parsexml (คำขอ); // บัญชีผู้ส่ง (open_id) สตริง fromusername = requestmap.get ("fromusername"); // สตริงบัญชีสาธารณะ tousername = requestmap.get ("tousername"); // ประเภทข้อความสตริง msgtype = requestmap.get ("msgtype"); // ตอบกลับค่าเริ่มต้นของข้อความนี้ข้อความข้อความ Message = new TextMessage (); TextMessage.SetTouSerName (จากชื่ออัสบันทึก); TextMessage.setFromusername (Tousername); TextMessage.setCreateTime (วันที่ใหม่ (). getTime ()); textMessage.setMsgType (MessageUtil.resp_message_type_text); TextMessage.SetFuncFlag (0); // เนื่องจากค่าแอตทริบิวต์ HREF จะต้องเกิดขึ้นในคำพูดสองครั้งความขัดแย้งนี้กับคำพูดสองเท่าของสตริงเอง textMessage.setContent ("ยินดีต้อนรับสู่ <a href =/" http://blog.csdn.net/lyq8479/ "> liu feng!"); // แปลงวัตถุข้อความเป็น xml สตริง respmessage = messageUtil.TextMessAgetOxMl (textMessage); // ข้อความถ้า (msgtype.equals (MessageUtil.req_Message_type_text)) {// รับเนื้อหาข้อความที่ส่งโดยเนื้อหาสตริงผู้ใช้ = requestmap.get ("เนื้อหา"); // สร้างข้อความ NewsMessage NewsMessage = NewsMessage (); NewsMessage.SetTouSername (FromUSERNAME); NewsMessage.setFromusername (Tousername); NewsMessage.setCreateTime (วันที่ใหม่ (). getTime ()); NewsMessage.setMsgType (MessageUtil.RESP_MESSAGE_TYPE_NEWS); NewsMessage.SetFuncFlag (0); รายการ <sarticle> articleList = new ArrayList <Saticor> (); // ข้อความเดียวถ้า ("1" .Equals (เนื้อหา)) {บทความบทความ = บทความใหม่ (); บทความ SETTITLE ("WeChat Public Account Development Tutorial Java Version"); บทความ SetDescription ("Liu Feng เกิดในปี 1980 มีประสบการณ์ 4 เดือนในการพัฒนาบัญชีสาธารณะ WeChat เพื่อช่วยให้ผู้เริ่มต้นเริ่มต้นการสอนชุดนี้เปิดตัวเป็นพิเศษและฉันหวังว่าจะใช้โอกาสนี้เพื่อพบเพื่อนมากขึ้น!"); บทความ. setpicurl ("http://0.xiaoqrobot.duapp.com/images/avatar_liufeng.jpg"); บทความ. seturl ("http://blog.csdn.net/lyq8479"); articlelist.add (บทความ); // ตั้งค่าจำนวนข้อความกราฟิก newsmessage.setarticlecount (articlelist.size ()); // ตั้งค่าคอลเลกชันกราฟิกที่มีอยู่ในข้อความกราฟิก newsmessage.setarticles (ArticLelist); // แปลงวัตถุข้อความกราฟิกเป็น XML สตริง respmessage = messageUtil.newsmessagetoxml (NewsMessage); } // ข้อความเดียว-รวมรูปภาพอื่นถ้า ("2" .Equals (เนื้อหา)) {บทความบทความ = บทความใหม่ (); บทความ SETTITLE ("WeChat Public Account Development Tutorial Java Version"); // qq emoticons และ emoticons สัญลักษณ์สามารถใช้ในข้อความบทความบทความ SetDescription ("Liu Feng เกิดในปี 1980" + Emoji (0x1f6b9) + ", ประสบการณ์ 4 เดือนในการพัฒนาบัญชีสาธารณะ บทช่วยสอนรวมถึงการกำหนดค่าอินเตอร์เฟสบรรจุภัณฑ์ข้อความการก่อสร้างเฟรมเวิร์กการส่งอิโมติคอน QQ สัญลักษณ์อิโมติคอนส่ง ฯลฯ /n /n ในภายหลังนอกจากนี้ยังมีการวางแผนที่จะเปิดใช้งานฟังก์ชั่นการพัฒนาฟังก์ชั่นการใช้งานจริงเช่นการพยากรณ์อากาศการค้นหาอุปกรณ์ต่อพ่วงฟังก์ชั่นแชท ฯลฯ "); // ตั้งค่ารูปภาพเป็นบทความว่างเปล่า SetPicurl (""); บทความ. seturl ("http://blog.csdn.net/lyq8479"); articlelist.add (บทความ); NewsMessage.setarticlecount (articlelist.size ()); NewsMessage.setArticles (ArticLelist); respmessage = messageUtil.newsmessagetoxml (NewsMessage); } // ข้อความหลายกราฟิกอื่นถ้า ("3" .Equals (เนื้อหา)) {บทความบทความ 1 = บทความใหม่ (); ข้อ 1.Settitle ("การสอนการพัฒนาบัญชีสาธารณะ WeChat/N บทนำ"); ข้อ 1.SetDescription (""); ข้อ 1.SetPicurl ("http://0.xiaoqrobot.duapp.com/images/avatar_liufeng.jpg"); ข้อ 1.seturl ("http://blog.csdn.net/lyq8479/article/details/8937622"); บทความบทความ 2 = บทความใหม่ (); บทความ 2.settitle ("ส่วนที่ 2/n ประเภทบัญชีสาธารณะ WeChat"); ข้อ 2.setDescription (""); บทความ 2.SetPicurl ("http://avatar.csdn.net/1/4/a/1_lyq8479.jpg"); บทความ 2.seturl ("http://blog.csdn.net/lyq8479/article/details/8941577"); บทความ 2.seturl ("http://blog.csdn.net/lyq8479/article/details/8941577"); บทความบทความ 3 = บทความใหม่ (); article3.settitle ("โทรเลข 3/n โหมดการพัฒนาการเปิดใช้งานและการกำหนดค่าอินเตอร์เฟส"); บทความ 3.SetDescription (""); บทความ 3.SetPicurl ("http://avatar.csdn.net/1/4/a/1_lyq8479.jpg"); บทความ 3.Seturl ("http://blog.csdn.net/lyq8479/article/details/8944988"); articlelist.add (ข้อ 1); articlelist.add (ข้อ 2); articlelist.add (ข้อ 3); NewsMessage.setarticlecount (articlelist.size ()); NewsMessage.setArticles (ArticLelist); respmessage = messageUtil.newsmessagetoxml (NewsMessage); } // ข้อความกราฟิกและข้อความหลายข้อความ --- ข้อความแรกไม่มีภาพอื่น ๆ ถ้า ("4" .Equals (เนื้อหา)) {บทความบทความ 1 = บทความใหม่ (); ข้อ 1.Settitle ("WeChat Public Account Development Tutorial Java Version"); ข้อ 1.SetDescription (""); // ตั้งค่าภาพเป็นบทความว่างเปล่า 1.SetPicurl (""); ข้อ 1.seturl ("http://blog.csdn.net/lyq8479"); บทความบทความ 2 = บทความใหม่ (); บทความ 2.settitle ("แพ็คเกจของเครื่องมือและเครื่องมือประมวลผลข้อความ"); ข้อ 2.setDescription (""); บทความ 2.SetPicurl ("http://avatar.csdn.net/1/4/a/1_lyq8479.jpg"); บทความ 2.seturl ("http://blog.csdn.net/lyq8479/article/details/8949088"); บทความบทความ 3 = บทความใหม่ (); article3.settitle ("ข้อ 5/nreceive และการตอบสนองของข้อความต่าง ๆ "); บทความ 3.SetDescription (""); บทความ 3.SetPicurl ("http://avatar.csdn.net/1/4/a/1_lyq8479.jpg"); บทความ 3.Seturl ("http://blog.csdn.net/lyq8479/article/details/8952173"); บทความบทความ 4 = บทความใหม่ (); บทความ ข้อ 4.setDescription (""); บทความ 4.SetPicurl ("http://avatar.csdn.net/1/4/a/1_lyq8479.jpg"); บทความ 4.seturl ("http://blog.csdn.net/lyq8479/article/details/8967824"); articlelist.add (ข้อ 1); articlelist.add (ข้อ 2); articlelist.add (ข้อ 3); articlelist.add (บทความ 4); NewsMessage.setarticlecount (articlelist.size ()); NewsMessage.setArticles (ArticLelist); respmessage = messageUtil.newsmessagetoxml (NewsMessage); } // ข้อความกราฟิกหลายข้อความ --- ข้อความสุดท้ายไม่มีภาพอื่นถ้า ("5" .Equals (เนื้อหา)) {บทความบทความ 1 = บทความใหม่ (); บทความ 1.Settitle ("การใช้นิวไลน์ในข้อความ"); ข้อ 1.SetDescription (""); ข้อ 1.SetPicurl ("http://0.xiaoqrobot.duapp.com/images/avatar_liufeng.jpg"); ข้อ 1.seturl ("http://blog.csdn.net/lyq8479/article/details/9141467"); บทความบทความ 2 = บทความใหม่ (); บทความ 2.settitle ("ใช้การเชื่อมโยงหลายมิติเว็บในข้อความ"); ข้อ 2.setDescription (""); บทความ 2.SetPicurl ("http://avatar.csdn.net/1/4/a/1_lyq8479.jpg"); บทความ 2.seturl ("http://blog.csdn.net/lyq8479/article/details/9157455"); บทความ 2.seturl ("http://blog.csdn.net/lyq8479/article/details/9157455"); บทความบทความ 3 = บทความใหม่ (); article3.settitle ("ถ้าคุณคิดว่าบทความมีประโยชน์สำหรับคุณโปรดฝากข้อความไว้ในบล็อกหรือทำตามบัญชีสาธารณะ WeChat Xiaoqrobot เพื่อสนับสนุน Liu Feng!"); บทความ 3.SetDescription (""); // ตั้งค่าภาพเป็น artict3.setpicurl (""); บทความ 3.Seturl ("http://blog.csdn.net/lyq8479"); articlelist.add (ข้อ 1); articlelist.add (ข้อ 2); articlelist.add (ข้อ 3); NewsMessage.setarticlecount (articlelist.size ()); NewsMessage.setArticles (ArticLelist); respmessage = messageUtil.newsmessagetoxml (NewsMessage); }}} catch (exception e) {e.printstacktrace (); } Return Respmessage; } / ** * การแปลงนิพจน์ Emoji (hex -> utf -16) * * @param hexemoji * @return * / สตริงสแตติกสาธารณะอิโมจิ (int hexemoji) {return string.valueof -

ฟังก์ชั่นที่ใช้โดยรหัสด้านบนคือการตอบกลับผู้ใช้ด้วยข้อความกราฟิกห้ารูปแบบดังนี้:

a) ผู้ใช้ส่ง 1 และตอบกลับข้อความเดียว บรรทัดรหัสอ้างอิง 68 ​​~ 81 เอฟเฟกต์การดำเนินการมีดังนี้:

b) ผู้ใช้ส่ง 2 ตอบกลับข้อความ - ไม่มีรูปภาพ บรรทัดรหัสอ้างอิง 82 ~ 96 เอฟเฟกต์การดำเนินการมีดังนี้:

คำอธิบาย: ชื่อและคำอธิบายของข้อความกราฟิกสามารถมีนิพจน์ QQ และนิพจน์สัญลักษณ์

c) ผู้ใช้ส่ง 3 และตอบกลับไปยังกราฟิกและข้อความหลายข้อความ บรรทัดรหัสอ้างอิง 97 ~ 123 เอฟเฟกต์การดำเนินการมีดังนี้:

หมายเหตุ: สำหรับข้อความหลายกราฟิกคำอธิบายจะไม่ปรากฏขึ้น การแบ่งบรรทัดสามารถใช้ในชื่อเพื่อให้การแสดงผลสวยงามยิ่งขึ้น

d) ผู้ใช้ส่ง 4 และตอบกลับข้อความกราฟิกหลายข้อความ-ข้อความแรกไม่มีรูปภาพ บรรทัดรหัสอ้างอิง 124 ~ 158 เอฟเฟกต์การดำเนินการมีดังนี้:

e) ผู้ใช้ส่ง 5 และตอบกลับข้อความกราฟิกหลายข้อความ-ข้อความสุดท้ายไม่มีรูปภาพ บรรทัดรหัสอ้างอิง 159 ~ 186 เอฟเฟกต์การดำเนินการมีดังนี้:

จะเห็นได้ว่ากราฟิกและข้อความมีเนื้อหาที่หลากหลายและรูปแบบการแสดงออกที่หลากหลาย ฉันหวังว่าทุกคนสามารถใช้พวกเขาได้อย่างสมเหตุสมผลตามลักษณะที่เกี่ยวข้องและความต้องการการใช้งานจริง

ในที่สุด จากประสบการณ์การปฏิบัติฉันจะสรุปการใช้กราฟิกและข้อความ :

1) ตรวจสอบให้แน่ใจว่าได้กำหนดค่าให้กับแอตทริบิวต์ URL ของกราฟิกและข้อความ ไม่ว่าจะเป็นภาพเดียวรูปภาพหลายภาพหรือรูปภาพที่ไม่มีรูปภาพพวกเขาอาจถูกคลิกโดยผู้ใช้ หาก URL ว่างเปล่าผู้ใช้จะเปิดหน้าว่างหลังจากคลิกซึ่งทำให้ผู้ใช้มีประสบการณ์ที่แย่มาก

2) คำอธิบายของรูปภาพและข้อความเดียวเท่านั้นที่จะปรากฏขึ้น และคำอธิบายของรูปภาพและข้อความหลายภาพจะไม่ปรากฏขึ้น

3) qq emoticons และ emoticons สัญลักษณ์สามารถใช้ในชื่อและคำอธิบายของกราฟิกและข้อความ การใช้อิโมจิอย่างมีเหตุผลจะทำให้ข้อความสดใสขึ้น

4) การแบ่งบรรทัดสามารถใช้ในชื่อและคำอธิบายของกราฟิกและข้อความ การใช้อย่างสมเหตุสมผลของการแบ่งบรรทัดจะทำให้โครงสร้างเนื้อหาชัดเจนขึ้น

5) ลิงก์ไฮเปอร์เท็กซ์ (แท็ก <a> ของ HTML) ไม่รองรับในชื่อและคำอธิบายของกราฟิกและข้อความ ไม่เพียง แต่เป็นไปไม่ได้ในทางเทคนิคเท่านั้น แต่ยังสมเหตุสมผลเพราะมีการคลิกที่ตั้งของกราฟิกและข้อความใด ๆ เบราว์เซอร์ในตัวของ WeChat จะถูกเรียกให้เปิด URL หากคุณใส่ไฮเปอร์ลิงก์สองสามรายการในชื่อและคำอธิบายคุณไม่ทราบว่าจะคลิกหน้าใด ฉันไม่เข้าใจจริงๆว่าทำไมนักเรียนหลายคนถึงถามคำถามนี้ การออกแบบมันไม่ดีหรือไม่

6) ลิงก์และลิงก์รูปภาพสำหรับกราฟิกและข้อความสามารถใช้ทรัพยากรภายใต้ชื่อโดเมนภายนอก ตัวอย่างเช่นในตัวอย่างนี้: ลิงก์โพสต์และบล็อกของ Liu Feng เป็นแหล่งข้อมูลทั้งหมดไปยังเว็บไซต์ CSDN มีหลายคนที่เชื่อว่า URL และ picurl ของกราฟิกและข้อความไม่สามารถใช้สำหรับลิงก์ภายนอก ฉันไม่รู้ว่าข่าวลือนี้เริ่มต้นที่ไหน การฝึกฝนเป็นเกณฑ์เดียวสำหรับการทดสอบความจริง!

7) ใช้รูปภาพขนาดที่ระบุ ขนาดภาพที่แนะนำของภาพแรกคือ 640*320 และขนาดภาพที่แนะนำของรูปภาพอื่น ๆ คือ 80*80 หากภาพที่ใช้มีขนาดใหญ่เกินไปมันจะโหลดช้าและใช้การจราจร หากภาพที่ใช้มีขนาดเล็กเกินไปมันจะถูกยืดออกหลังจากแสดงซึ่งจะน่าเกลียดถ้ามันบิดเบี้ยว

8) แนะนำให้ควบคุมรูปภาพและข้อความที่ 1-4 ด้วยวิธีนี้หน้าจอหนึ่งสามารถแสดงบนเทอร์มินัลส่วนใหญ่และผู้ใช้สามารถเข้าใจเนื้อหาหลักของข้อความได้อย่างคร่าวๆซึ่งมีแนวโน้มที่จะแจ้งให้ผู้ใช้คลิกและอ่าน

ข้างต้นเป็นเนื้อหาทั้งหมดของบทความนี้ ฉันหวังว่าเนื้อหาของบทความนี้จะช่วยในการศึกษาหรือทำงานของทุกคน ฉันหวังว่าจะสนับสนุน Wulin.com เพิ่มเติม!